ng-repeat 不适用于温泉 ui

ng-repeat not working with onsen ui

我要疯了,这是一件小事,但我找不到解决方案... 我有这个 js 文件(angularjs 应用程序在 html 文档的开头初始化)

app.controller('slidingMenuCtrl', function($scope) {
    $scope.categories = [
        {title: 'Festas', icon: 'ion-ios-pint', notifications: 3},
        {title: 'Palestras', icon: 'fa-microphone', notifications: 0}
    ];
    $scope.test = 'aaa';
});

在我的某个地方 html

<ons-template id="menu.html" ng-controller="slidingMenuCtrl">
    <ons-page>
        <div ng-repeat="x in categories">
            {{x.title}}
        </div>
        <div>
            {{test}}
        </div>
    </ons-page>
</ons-template>

带有 ng-repeat 的 div 什么都不显示,但是没有它的 'aaa' 正确显示,为什么?

ons-template 模板不支持 ng-controller 指令,基本上它需要一个想法来处理模板,然后如果我们在 http 上请求模板 returns 用那个 id 注册了 ons-template,这里你有 menu.html

您可以通过在其中添加类型为 text/ons-templatescript 标签来做同样的事情。它与 angular.

中的 type/ng-template 相同

模板

<script type="text/ons-template" id="main.html">

   ...content here...

</script>

ons-page 上添加 ng-controller 将通过实例化 controller 指定的 ng-controller 指令使其工作。

代码

<ons-page ng-controller="slidingMenuCtrl">
    <div ng-repeat="x in categories">
        {{x.title}}
    </div>
    <div>
        {{test}}
    </div>
</ons-page>