angularjs - 使用 ng-repeat 重复具有不同 id 和 ng-init 的相同 div

Question

我如何使用 ng-repeat 重复具有这种结构的多个 div(其中每个 div 的邻域不同，但其余部分相同)？

<div id="neighborhood" ng-controller="WeatherController" ng-init="init('neighborhood')">
  <h1>It's currently {{weather}}</h1>
  <p>Sunny: {{sunny}}</p>
  <p>Foggy: {{foggy}}</p>
  <input type="button" value="Sunny" ng-click="sunny = sunny + 1"/>
  <input type="button" value="Foggy" ng-click="foggy = foggy + 1"/>
</div>

Answer 1

您可以使用插值来填充 id 并使用 AngularJS 的模型调用 init

<div ng-app="myApp" ng-controller="WeatherController" >
    <div ng-repeat="item in data">
        <div id="{{item.id}}" ng-init="init(item.value)">
            ...
        </div>
    </div>
</div>

function WeatherController($scope) {
    $scope.init = function (item) {
        console.log(item);
    }

    $scope.data = [{
        id: 'neighborhood',
        value: 'neighborhood'
    }, {
        id: 'neighborhood1',
        value: 'neighborhood1'
    }]
}

DEMO