Question

我试图绑定来自角度控制器的数据，但它不是bading而不是它显示表达式我已经在我的布局中包含了angular.js但是下面没有工作代码请帮帮我

文件名：Home.cshtml

<div class="container" ng-app="home">
<div class="container">
    <div class="panel-group row" ng-controller="Eventapp">
        <div class="panel col-lg-4" ng-repeat="product in products">
            <div class="panel-heading">
                <h3>{{product.heading}}</h3>
            </div>
            <div class="panel-body">
                <ul>
                    <li ng-repeat="content in product.contents">
                        {{content}}
                    </li>
                </ul>
            </div>
            <div class="panel-footer">
                <button class="btn btn-success">contact us</button>
            </div>
        </div>
</div>

Angular controller：Eventappcontroller.js

'use strict';




 var home = angular.module('home', []);
    home.controller('Eventapp', function ($scope) {
        $scope.products = [
            { heading: 'School', Contents: ['Semi-English', 'Semi-English', 'Semi-English'] },
         { heading: 'School', Contents: ['Semi-English', 'Semi-English', 'Semi-English'] },
     { heading: 'School', Contents: ['Semi-English', 'Semi-English', 'Semi-English'] },
     { heading: 'School', Contents: ['Semi-English', 'Semi-English', 'Semi-English'] },
      { heading: 'School', Contents: ['Semi-English', 'Semi-English', 'Semi-English'] }
        ]
    })

布局页面底部包含的脚本---＆gt;在身体标签结束之前

<script src="~/Scripts/angular.min.js"></script>
    <script src="~/Scripts/angular.js"></script>
    <script src="~/Scripts/jquery-1.10.2.js"></script>
    <script src="~/Scripts/controller/EventappController.js"></script>

<script src="~/Scripts/jquery-1.10.2.min.js"></script>

输出： {{product.heading}} {{内容}} 这将是按钮

Answer 1

首先检查循环中的拼写错误//contect must be content

<li ng-repeat="contect in product.contents"> //contect must be  content
         {{content}}
</li>

如果那件事也行不通，请尝试如下所示。

在Contents数组上使用一组对象。就像这样：

Contents: [{value:'Semi-English'},{value: 'Semi-English'},{value: 'Semi-English'}]

然后在你的转发器中使用如下：

<li ng-repeat="content in product.contents">
       {{content.value}}
</li>

Answer 2

我无法从您的代码中发现任何错误。有一个jsfiddle工作：

＆＃13;

'use strict';
var home = angular.module('home', []);

home.controller('Eventapp', ['$scope',
  function($scope) {
    $scope.products = [{
      heading: 'School',
      Contents: ['Semi-English', 'Semi-English', 'Semi-English']
    }, {
      heading: 'School',
      Contents: ['Semi-English', 'Semi-English', 'Semi-English']
    }, {
      heading: 'School',
      Contents: ['Semi-English', 'Semi-English', 'Semi-English']
    }, {
      heading: 'School',
      Contents: ['Semi-English', 'Semi-English', 'Semi-English']
    }, {
      heading: 'School',
      Contents: ['Semi-English', 'Semi-English', 'Semi-English']
    }];
  }
]);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div class="container" ng-app="home">
  <div class="container">
    <div class="panel-group row" ng-controller="Eventapp">
      <div class="panel col-lg-4" ng-repeat="product in products">
        <div class="panel-heading">
          <h3>{{product.heading}}</h3>
        </div>
        <div class="panel-body">
          <ul>
            <li ng-repeat="contect in product.contents">
              {{content}}
            </li>
          </ul>
        </div>
        <div class="panel-footer">
          <button class="btn btn-success">contact us</button>
        </div>
      </div>
    </div>
  </div>
</div>

＆＃13;

无法绑定angularjs控制器的数据

2 个答案: