angular js在asp.net的contentplace holder / master页面中不起作用

时间:2016-03-08 13:50:06

标签: javascript jquery asp.net angularjs

没有母版页角js正常工作。但是在添加母版页时angular.js函数不能正常工作。如何根据内容位置编写函数和ids。什么改变功能?

 <asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
     <title></title>
    <link rel="stylesheet" href="style.css">
  <script src="https://code.angularjs.org/1.4.9/angular.js" data-semver="1.4.9"></script>
  <script src="script.js"></script>

<script>
    var app = angular.module('myApp',[]);
        app.controller('MainCtrl', function($scope) {
        $scope.qty =10;
        $scope.unitprice =10;
    });
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
   <div ng-app>
<table ng-controller="MainCtrl">
<tr>
  <td>
    <lable> Qty : </lable>
  </td>
  <td>
    <input type="text" runat="server" ID="txtQty" ng-model="qty" />
  </td>
</tr>
<tr>
  <td>
    <lable> Unit Price : </lable>
  </td>
  <td>
    <input type="text" runat="server" ID="txtUnitPrice" ng-model="unitprice" />
  </td>
</tr>
<tr>
  <td>
    <lable>Total Price :</lable>
  </td>
  <td>
    <input type="text" runat="server" ID="txttotalprice" ng-model="totalprice" ng-bind="{{totalprice= qty*unitprice }}" />
  </td>
</tr>

         

</asp:Content>

1 个答案:

答案 0 :(得分:0)

切换到angular-material md-content并删除所有asp标签。使用app.js文件创建一个脚本目录,并在其中输出您的angluar js代码。然后在您的视图中引用。混合ASP和Angular不会很好。 Material

您的app.js应如下所示:

angular.module('opcaApp', ['ngMaterial'])
//your controller code. 

然后在外部div或md-content指令内部与您的控制器代码进行交互:

<md-content>
 <div ng-controller="<your controller>">

 </div>
</md-content>