在运行时替换/更改.aspx页面

时间:2015-02-16 09:20:17

标签: asp.net angularjs twitter-bootstrap

我将DNN与AngularJS和bootstrap一起使用。现在我有一个

形式的页面布局

enter image description here

我现在想要的是,根据用户在菜单中选择的功能必须掌握和要更换的细节。 我必须在运行时添加不同的.aspx页面。

有简单的方法吗?

2 个答案:

答案 0 :(得分:0)

你不能"取代" .ASPX页面 - 您可以从不同的端点(页面,如果您愿意)请求HTML,ASP.NET将根据请求生成它们。

除了语言上的不准确之外,您还需要让您的客户端Angular应用根据某些选择值呈现不同的模板。您可以使用ng-include并链接到模板网址,该网址可以由.ASPX页面生成。

所以,假设你有一个像这样的简单HTML页面:

<select ng-model="selection" ng-change="changeMasterAndDetail()">
   <option value="foo">foo</option> 
   <option value="bar">bar</option>
</select>

<div ng-include="master"></div>
<div ng-include="detail"></div>

在控制器中,您可以根据选择分配模板Url:

.controller("SelectionCtrl", function($scope){
   $scope.selection = foo;
   $scope.changeMasterAndDetail = changeMasterAndDetail;

   changeMasterAndDetail();

   function changeMasterAndDetail(){
      if ($scope.selection === "foo"){
         $scope.master = "/path/to/master/pageA.aspx";
         $scope.detail = "/path/to/detail/pageA.aspx";
      } else if ($scope.selection === "bar"){
         $scope.master = "/path/to/master/pageB.aspx";
         $scope.detail = "/path/to/detail/pageB.aspx";
      }
   }
});

答案 1 :(得分:0)

如果您要求在部分中点击菜单项来替换详细信息的内容,则只需要设置{{ 1}}。

您可以创建一个母版页,其中保留主版块以及其中的所有标签或选项以及包含内容页面网址的<a href = "destinationURL">Option</a>

您还应在主页中添加href,详细信息页面的内容将在该页面中显示。

现在,当您创建新页面时,您选择母版页并开始在<ContentPlaceHolder>区域中开始编写内容。这样,您的所有内容都会显示在详细信息区域中。该区域将根据<asp:Content>动态加载。