@!Model[.Parameter]@!Current[.Parameter]
@!Model.Test@Each @!Current.Test@EndEach
// Renders the partial view with the same model as the parent@Partial['subview.sshtml'];// Renders the partial view using the User as the model@Partial['subview.sshtml', Model.User];
Nancy Learning-View エンジン継続 Cross-Platform_html/css_WEB-ITnose
前の記事では、Nancy と Nancy セルフホスティングの基本について説明しました。次に、ビュー エンジンの学習を始めましょう。
Nancy は現在、SSVE と Razor の 2 つのタイプをサポートしています。以下一緒に勉強していきましょう。
スーパー シンプル ビュー エンジン
SSVE の正式名は Super Simple View Engine で、翻訳すると スーパー シンプル ビュー エンジン となります。
デフォルトで組み込まれているため、Nancy で個別に参照する必要はありません。このエンジンは、sshtml、html、または htm ファイルを処理します。
モデルは、標準タイプまたは ExpandoObject (または IDynamicMetaObjectProvider を実装するか、そのプロパティにアクセスするための IDictionary
SSVE は正規表現ベースのビュー エンジンであり、「実行コード」がないため、独自のコードを指定して実行することはできません。使用できる組み込みの構文/コマンドは次のとおりです。
標準変数置換
パラメータの文字列表現、またはパラメータが指定されていない場合はモデル自体に置換されます。たとえば、無効なモデル プロパティを指定した場合など、置換が実行されません。 with [Err!]
Syntax
@Model[.Parameters]
Example
Hello @Model.Name, your age is @Model.User.Age
Iterators
コレクションであるモデルを反復処理できるようにします
Syntax
@Each[.Parameters] [@Current[.Parameters]]@EndEach
@Each は暗黙的にモデルに関連付けられます。反復では、 @Current はコレクション内の現在の項目を表します。 @Current はイテレーター ブロック内で複数回使用でき、 @Model と同じ方法でアクセスできます。 (下記の暗黙的な条件文を参照)
Syntax:
@Each.Users Hello @Current.Name!@EndEach
Example
@If[Not].Parameters [contents]@EndIf
暗黙的な条件文
モデルに ICollection を実装するプロパティがある場合は、暗黙的な条件文を使用できます。暗黙的な条件構文は通常の条件構文と同じですが、パラメーター部分に Has プレフィックスを付けることができます。コレクションに項目が含まれる場合は条件が true になり、含まれない場合、または null の場合は false になります。
@IfNot.HasUsers No users found!@EndIf
Has[CollectionPropertyName]
HTML エンコーディング
両方@Model および @Current キーワード (パラメーターの有無にかかわらず) には、 @ の後にオプションの ! 演算子を指定して、出力を HTML エンコードできます。
Partials
プロパティをレンダリングします。現在のモデルの を部分ビューのモデルとして使用するように指定することも、代わりに現在のビューのモデルを使用するために省略することもできます。構文
@If.HasUsers Users found!@EndIf
@!Model[.Parameter]@!Current[.Parameter]
ログイン後にコピー
マスター ページマスター ページに共有レイアウトを配置し、ビューによって設定されるコンテンツ セクションを宣言できます。マスター ページをネストすることができ、すべてのコンテンツ セクションにコンテンツを提供する義務はありません。@!Model[.Parameter]@!Current[.Parameter]
マスター ページはビューの @Model にアクセスでき、ビューで使用するマスターの名前を指定するときのファイル拡張子はオプションです
@Section タグは複数回使用でき、両方の宣言に使用されます。
構文
@!Model.Test@Each @!Current.Test@EndEach
ログイン後にコピー
Example@!Model.Test@Each @!Current.Test@EndEach
@Partial['<view name>'[, Model.Property]]
偽造防止トークンをページ上の非表示の入力にレンダリングします。クロスサイト リクエスト フォージェリ攻撃を防ぎます。新しいリクエストがサーバーに送信されると、トークンは自動的に検証されます (CSRF 保護がオフになっていないことが前提です)。
構文
// Renders the partial view with the same model as the parent@Partial['subview.sshtml'];// Renders the partial view using the User as the model@Partial['subview.sshtml', Model.User];
ログイン後にコピー
例// Renders the partial view with the same model as the parent@Partial['subview.sshtml'];// Renders the partial view using the User as the model@Partial['subview.sshtml', Model.User];
@Master['<name>']@Section['<name>']@EndSection
一般的に使用されるコマンドをいくつか示します。
1.モデル
2.それぞれ
3.If
4.部分
5.マスターページとセクション
首先创建一个项目。建议创建web空项目 。
我是直接使用上次的项目 http://www.cnblogs.com/linezero/p/5121887.html
先创建一个Module SSVEModule
然后添加Views文件夹 -》然后再在其下添加 SSVE文件夹 -》添加对应的View 页。
这样使项目更加清楚。
1.Model
Get["/model"] = r => { var model = "我是字符串"; return View["model", model]; };在SSVE 文件夹下添加一个model.html
<!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> <meta charset="utf-8" /> <title></title></head><body> @Model</body></html>
然后我们访问页面 访问地址： http://localhost:9000/ssve/model
2.Each
Get["/each"] = r => { var arr = new int[] { 3, 6, 9, 12, 15, 12, 9, 6, 3 }; return View["each", arr]; };each.html
<!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> <meta charset="utf-8" /> <title></title></head><body> @Each <p>@Current</p> @EndEach</body></html>
访问地址： http://localhost:9000/ssve/each
3.If
Get["/if"] = r => { return View["if", new { HasModel = true }]; };if.html
<!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> <meta charset="utf-8" /> <title></title></head><body> @If.HasModel <p>我出现了</p> @EndIf @IfNot.HasModel <p>我没办法出现</p> @EndIf</body></html>
访问地址： http://localhost:9000/ssve/if
4.Partials
@Partial['header.html']
在SSVE 下添加header.html 然后在页面添加这句即可。
5.Master pages and sections
master.html
<!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> <meta charset="utf-8" /> <title></title></head><body> @Partial['header.html'] @Section['Content']</body></html>
使用 master
@Master['master.html']@Section['Content']<p>master partial content 结合</p> @Model@EndSection
SSVEModule.cs
using Nancy;using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threading.Tasks;namespace NancyDemo{ public class SSVEModule : NancyModule { public SSVEModule():base("/ssve") { Get["/"] = r => { var os = System.Environment.OSVersion; return "Hello SSVE
System:" + os.VersionString; }; Get["/model"] = r => { var model = "我是字符串"; return View["model", model]; }; Get["/each"] = r => { var arr = new int[] { 3, 6, 9, 12, 15, 12, 9, 6, 3 }; return View["each", arr]; }; Get["/if"] = r => { return View["if", new { HasModel = true }]; }; } }}SSVE视图引擎源码：https://github.com/grumpydev/SuperSimpleViewEngine
Razor View Engine
Razor 相信大家都是非常熟悉，所以也就不在这里过多做语法讲解。
主要是讲解在Nancy中使用Razor 视图引擎。
Nancy 的Razor 是自定义实现的，所以与ASP.NET MVC 中的Razor 有所不同。
在Nancy中绑定模型是@Model 不是ASP.NET MVC @model
安装
要在Nancy中使用Razor 需要安装 Nancy.ViewEngines.Razor
Nuget：Install-Package Nancy.Viewengines.Razor
添加Razor以后，会默认在app.config 添加Razor相关配置。
使用
建议大家新建一个空的web项目，这样便于编写视图。
在视图中声明 关键字为： @inherits
@inherits Nancy.ViewEngines.Razor.NancyRazorViewBase
其他语法与ASP.NET MVC Razor相同。
我还是在原项目上进行添加。
先创建一个Module RazorModule
然后添加Views文件夹 -》然后再在其下添加 Razor文件夹 -》添加对应的View 页。以 cshtml结尾的文件，也就是视图文件。
1.Model
Get["/index"] = r => { var model = "我是 Razor 引擎"; return View["index",model]; };index.cshtml
@inherits Nancy.ViewEngines.Razor.NancyRazorViewBase<!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> <meta charset="utf-8" /> <title></title></head><body> @Model</body></html>
访问地址： http://localhost:9000/razor/index
2.each
Get["/each"] = r => { var arr = new int[] { 3, 6, 9, 12, 15, 12, 9, 6, 3 }; return View["each", arr]; };虽然Module中的代码与前面相同。但View 就不一样了。
each.cshtml
@inherits Nancy.ViewEngines.Razor.NancyRazorViewBase<dynamic><!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> <meta charset="utf-8" /> <title></title></head><body> @foreach (var item in Model) { <p>@item</p> }</body></html>访问地址： http://localhost:9000/razor/each
RazorModule.cs
using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threading.Tasks;using Nancy;namespace NancyDemo{ public class RazorModule:NancyModule { public RazorModule() :base("/razor") { Get["/"] = r => { var os = System.Environment.OSVersion; return "Hello Razor
System:" + os.VersionString; }; Get["/index"] = r => { var model = "我是 Razor 引擎"; return View["index",model]; }; Get["/each"] = r => { var arr = new int[] { 3, 6, 9, 12, 15, 12, 9, 6, 3 }; return View["each", arr]; }; } }}项目结构
因为我使用的项目是控制台程序，Views 文件夹下的文件必须都要在 属性 选择 始终复制 。
在linux上运行可以参考上篇文章。
最后留个坑，下一篇：Nancy 学习-进阶部分 继续跨平台。请大家多多支持。
参考链接：
https://github.com/NancyFx/Nancy/wiki/The-Super-Simple-View-Engine
如果你觉得本文对你有帮助，请点击“ 推荐 ”，谢谢。
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
AI Hentai Generator
AIヘンタイを無料で生成します。
人気の記事
ホットツール
メモ帳++7.3.1
使いやすく無料のコードエディター
SublimeText3 中国語版
中国語版、とても使いやすい
ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境
ドリームウィーバー CS6
ビジュアル Web 開発ツール
SublimeText3 Mac版
神レベルのコード編集ソフト（SublimeText3）
ホットトピック
7529
15
1378
52
81
11
21
76
＆lt; Progress＆gt;の目的は何ですか 要素？
Mar 21, 2025 pm 12:34 PM
この記事では、HTML＆lt; Progress＆gt;について説明します。要素、その目的、スタイリング、および＆lt; meter＆gt;との違い要素。主な焦点は、＆lt; Progress＆gt;を使用することです。タスクの完了と＆lt; Meter＆gt; statiの場合
HTML5のクロスブラウザー互換性のベストプラクティスは何ですか？
Mar 17, 2025 pm 12:20 PM
記事では、HTML5クロスブラウザーの互換性を確保するためのベストプラクティスについて説明し、機能検出、プログレッシブエンハンスメント、およびテスト方法に焦点を当てています。
＆lt; datalist＆gt;の目的は何ですか 要素？
Mar 21, 2025 pm 12:33 PM
この記事では、HTML＆lt; Datalist＆GT;について説明します。オートコンプリートの提案を提供し、ユーザーエクスペリエンスの改善、エラーの削減によりフォームを強化する要素。
HTML5フォーム検証属性を使用してユーザー入力を検証するにはどうすればよいですか？
Mar 17, 2025 pm 12:27 PM
この記事では、ブラウザのユーザー入力を直接検証するために、必要、パターン、MIN、MAX、および長さの制限などのHTML5フォーム検証属性を使用して説明します。
＆lt; meter＆gt;の目的は何ですか 要素？
Mar 21, 2025 pm 12:35 PM
この記事では、html＆lt; meter＆gt;について説明します。要素は、範囲内でスカラーまたは分数値を表示するために使用され、Web開発におけるその一般的なアプリケーション。それは差別化＆lt; Meter＆gt; ＆lt; Progress＆gt;およびex
ビューポートメタタグとは何ですか？レスポンシブデザインにとってなぜそれが重要なのですか？
Mar 20, 2025 pm 05:56 PM
この記事では、モバイルデバイスのレスポンシブWebデザインに不可欠なViewportメタタグについて説明します。適切な使用により、最適なコンテンツのスケーリングとユーザーの相互作用が保証され、誤用が設計とアクセシビリティの問題につながる可能性があることを説明しています。
＆lt; iframe＆gt;の目的は何ですか タグ？使用する際のセキュリティ上の考慮事項は何ですか？
Mar 20, 2025 pm 06:05 PM
この記事では、＆lt; iframe＆gt;外部コンテンツをWebページ、その一般的な用途、セキュリティリスク、およびオブジェクトタグやAPIなどの代替案に埋め込む際のタグの目的。
HTMLは初心者のために簡単に学ぶことができますか？
Apr 07, 2025 am 12:11 AM
HTMLは、簡単に学習しやすく、結果をすばやく見ることができるため、初心者に適しています。 1）HTMLの学習曲線はスムーズで簡単に開始できます。 2）基本タグをマスターして、Webページの作成を開始します。 3）柔軟性が高く、CSSおよびJavaScriptと組み合わせて使用できます。 4）豊富な学習リソースと最新のツールは、学習プロセスをサポートしています。
