如何使用与迪朗达尔CSHTML文件？(How can I use cshtml files with

2019-07-20 06:15发布

站内文章 / 前沿技术
42 0 0

我在VS2012的DurandalJS入门套件模板...所有的伟大工程...

但是，在一些看法，我需要做这样的事情： 

@if (Roles.IsUserInRole("Administrators"))
{
   <p>Test</p>
}

然而，随着迪朗达尔我所有的意见“ html的”文件......这有可能使用“.cshtml”文件访问这样的一些信息？

或者有没有其他的方式来做到这一点与迪朗达尔？

初级

Answer 1:

是的，你完全可以使用CSHTML文件与迪朗达尔，并采取在服务器上利用剃刀。 我想这也意味着你要MVC，这样你就可以做到这一点，并使用它的路由。

如果你不要;不想路由，那么你可以设置webpages.Enabled在web.config中，为其他意见建议。 

<add key="webpages:Enabled" value="true" />


Answer 2:

我这样做是这样的：

  1. 创建迪朗达尔意见的通用控制器： 

     public class DurandalViewController : Controller { // // GET: /App/views/{viewName}.html [HttpGet] public ActionResult Get(string viewName) { return View("~/App/views/" + viewName + ".cshtml"); } }

  2. 注册一个路线： 

     routes.MapRoute( name: "Durandal App Views", url: "App/views/{viewName}.html", defaults: new { controller = "DurandalView", action = "Get" } );

  3. 复制查看/ web.config中/App/views/web.config（所以剃刀在这个位置视图的工作）。

这让我正常使用的迪朗达尔公约（甚至HTML扩展视图），并把迪朗达尔意见CSHTML文件在其正常位置，无需添加任何更多的服务器代码。

如果你也有静态的HTML视图中，您也可以将子文件夹中CSHTML观点或使用正常的MVC /浏览文件夹。



Answer 3:

我不建议使用ASP.NET MVC与迪朗达尔。

什么你可能希望做的是使用Razor视图引擎 （得到一个编译器，打字强等的优点）从ASP.NET MVC中独立存在。 只是针对的WebAPI数据I / O是绰绰有余非常有效地创建一个应用程序Durandal.js更多。

如果您有兴趣使用剃刀/ CSHTML与迪朗达尔和淘汰赛有一个开放源码的选项在那里叫FluentKnockoutHelpers可能是你正在寻找什么。 它提供了许多ASP.NET MVC的“好”的部分，允许您使用迪朗达尔和淘汰赛的真棒能力几乎没有挫折的。

  • 资源

  • 使用Durandal.js现场演示

简而言之它提供了一堆这使得做迪朗达尔/淘汰赛发展就像ASP.NET MVC为方便等特点。 （您只需提供您的JavaScript脚本模型是基于关闭了大部分的功能，C＃类型。）您只需要编写JavaScript和复杂的情况下，未编译标记这是不可避免的，不超过MVC不同！ （除了在MVC的代码也将有可能最终也将是一个很大的jQuery的混乱这就是为什么你在第一时间使用迪朗达尔/淘汰赛！）

特征：

  • 无痛生成语法淘汰赛强类型，流畅，lambda表达式助手类似于ASP.NET MVC
  • 语法富二代智能感知和编译器的支持
  • 流利的语法是一件轻而易举的创建自定义的助手或扩展什么建
  • OSS替代ASP.NET MVC佣工：随意添加可选功能，每个人在社会上可以使用
  • 基于在几行代码.NET类型和DataAnnotations所有当前/未来的应用类型和变化无痛提供验证
  • 客户端的JavaScript对象工厂（基于C＃的类型），以创建例如，一个列表的新项目，具有零个头痛或服务器流量

例如但FluentKnockoutHelpers 

<div class="control-group">
    <label for="FirstName" class="control-label">
        First Name
    </label>
    <div class="controls">
        <input type="text" data-bind="value: person.FirstName" id="FirstName" />
    </div>
</div>
<div class="control-group">
    <label for="LastName" class="control-label">
        Last Name
    </label>
    <div class="controls">
        <input type="text" data-bind="value: person.LastName" id="LastName" />
    </div>
</div>
<h2>
    Hello,
    <!-- ko text: person.FirstName --><!-- /ko -->
    <!-- ko text: person.LastName --><!-- /ko -->
</h2>

提供FluentKnockoutHelpers与.NET类型，你可以使用智能感知和剃刀/ CSHTML编译器做到这一点的风格 

@{
  var person = this.KnockoutHelperForType<Person>("person", true);
}

<div class="control-group">
    @person.LabelFor(x => x.FirstName).Class("control-label")
    <div class="controls">
        @person.BoundTextBoxFor(x => x.FirstName)
    </div>
</div>
<div class="control-group">
    @person.LabelFor(x => x.LastName).Class("control-label")
    <div class="controls">
        @person.BoundTextBoxFor(x => x.LastName)
    </div>
</div>
<h2>
    Hello,
    @person.BoundTextFor(x => x.FirstName)
    @person.BoundTextFor(x => x.LastName)
</h2>

看看的来源或现场演示为FluentKnockoutHelper的功能在一个不平凡的Durandal.js应用的详尽概述。



Answer 4:

我不建议您直接使用.cshtml文件的意见。 你关闭放置.cshtml文件幕后控制人更好。

例如，取样品HotTowel，编辑/App/main.js，并替换为以下函数定义： 

define(['durandal/app', 
        'durandal/viewLocator', 
        'durandal/system',
        'durandal/plugins/router',
        'durandal/viewEngine', 
        'services/logger'],
function (app, viewLocator, system, router, viewEngine, logger) {

需要注意的是我们加入到迪朗达尔视图引擎的引用。 然后，我们需要更换 

viewLocator.useConvention();

同

viewLocator.useConvention('viewmodels', '../../dynamic'); 
viewEngine.viewExtension = '/';

第一个参数viewLocation.useConvention设置/应用/的ViewModels /目录作为视图模型的js文件的位置，但对于观察位置，使用URL http://example.com/dynamic/ ，与“延长/”。 所以，如果迪朗达尔正在寻找一个名为“外壳”的观点，将参考http://example.com/dynamic/shell/ （这是因为视图目录相对的ViewModels目录映射，从而/应用/的ViewModels / ../../dynamic会给你只需/动态）。

按照惯例，这之前的URL（ http://example.com/dynamic/shell/ ）将被映射到控制器DynamicController和行动“壳”。

在此之后，你只需要添加一个控制器 - DynamicController.cs，就像这样： 

// will render dynamic views for Durandal
public class DynamicController : Controller
{
    public ActionResult Shell()
    {
        return View();
    }

    public ActionResult Home()
    {
        return View();
    }

    public ActionResult Nav()
    {
        return View();
    }

    public ActionResult Details()
    {
        return View();
    }

    public ActionResult Sessions()
    {
        return View();
    }

    public ActionResult Footer()
    {
        return View();
    }
}

上述每个行动的创建.cshtml文件。 这样，你使用的控制器，服务器端的IoC等来为您的SPA动态视图。



Answer 5:

DurandaljS是主要形成用于单页的应用程序一个坚实的基础（SPA）的客户端的框架。 我假设你正在使用asp.net网站API作为您的服务器技术。 在这种情况下，可以判断用户的角色您的API控制器内，并基于该数据返回到客户端。 在客户端“如果”你可以用敲，以显示/隐藏网页中的某些领域具有约束力。

你也许可以做的是放置在Index.cshtml此代码。



Answer 6:

下面的链接显示如何自定义的moduleId到viewid映射

http://durandaljs.com/documentation/View-Location/

按照惯例迪朗达尔试图找到视图URL在下面的步骤

1）是否Checke对象具有getView()函数返回DOM或字符串（URL为视图）

2）如果对象不具有getView函数然后检查对象是否具有viewUrl属性

3）如上述两个步骤未能产生URL或drundal下降到默认约定DOM视图

其中的moduleId映射xyz.js以查看xyz.html使用main.js定义视图URL（查看文件夹的路径）

因此对于的moduleId xyz.js视图的路径将是views/xyz.html

你可以通过覆盖重写此默认映射行为convertModuleIdToViewId功能。

因此，有很多方法可以自定义视图的URL特定型号（.js文件对象）



Answer 7:

我做了一个扩展，迪朗达尔，让你与applicationHost格放在一起的applicationContent格在CSHTML文件的功能。 在applicationContent你现在可以通过基因敲除绑定在一起，同时使用的ASP.NET MVC的语法。

我唯一所做的就是把一些额外的代码在viewLocator.js文件，它会查找applicationContent DIV： 

        locateViewForObject: function(obj, area, elementsToSearch) {
        var view;

        if (obj.getView) {
            view = obj.getView();
            if (view) {
                return this.locateView(view, area, elementsToSearch);
            }
        }

        if (obj.viewUrl) {
            return this.locateView(obj.viewUrl, area, elementsToSearch);
        }

        view = document.getElementById('applicationContent');
        if (view) {
            return this.locateView(view, area, elementsToSearch);
        }

        var id = system.getModuleId(obj);
        if (id) {
            return this.locateView(this.convertModuleIdToViewId(id), area, elementsToSearch);
        }

        return this.locateView(this.determineFallbackViewId(obj), area, elementsToSearch);
    },

您的原始文件CSHTML现在可以做这样的事情： 

<div class="row underheader" id="applicationContent">
<div class="small-5 columns">
    <div class="contentbox">
        @using (Html.BeginForm("Generate", "Barcode", FormMethod.Post, Attributes.Create()
                                                                                    .With("data-bind", "submit: generateBarcodes")))
        {
            <div class="row formrow">
                <label for="aantalBijlagen">@Translations.Label_AantalBijlagen</label>
            </div>
            <div class="row">
                <select name="aantalBijlagen" class="small-6 columns">
                    <option>0</option>
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                    <option>4</option>
                </select>
            </div>
            <div class="row">
                <button class="button right" type="submit" id="loginbutton"><span class="glyphicon glyphicon-cog"></span> @Translations.Action_Generate</button>
            </div>
        }
    </div>
</div>
<div class="small-7 columns" data-bind="if: hasPdfUrl">
    <div class="contentbox lastcontent">
        <iframe data-bind="attr: {src: pdf_url}"></iframe>
    </div>
</div>

你可以找到我的迪朗达尔项目的叉这里和一个什么样的小志文章，以及如何我这样做是在这里 。



Answer 8:

我不是很熟悉，但DurandalJS，因为它是一个客户端系统，应该没有什么区别什么技术用于在服务器上生成的HTML标记。 所以，如果你用剃刀CSHTML文件在服务器上生成的HTML，DurandalJS应该只是用它的罚款。

如果你得到一个特定的错误，那么请共享的错误，但我想不出任何理由为什么它是行不通的。



文章来源: How can I use cshtml files with Durandal?
标签： asp.net-mvc-4 single-page-application durandal
举报

收藏的人(0)

Ta的文章 更多文章
登录 后发表评论
0条评论
还没有人评论过~