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-template
的 script
标签来做同样的事情。它与 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>
我要疯了,这是一件小事,但我找不到解决方案... 我有这个 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-template
的 script
标签来做同样的事情。它与 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>