Onsen的Navigator - pushPage功能

时间:2014-08-11 08:03:47

标签: angularjs onsen-ui

我实现了一个控制器来存储项目的标题和与该项目相关联的页面链接。

myApp.controller('takeAwayListCtrl', function($scope)
{
$scope.items = [{itemName: 'Pizze', page: 'pizze_takeaway.html'}, {itemName: 'Pasta', page: 'pasta_takeaway.html'}, {itemName: 'Dessert', page: 'dessert_takeaway.html'}];
});

虽然x.itemName是正确的,但是当我将它传递给导航器的pushPage函数时,以下代码无法正确解释页面属性x.page。

        <script type="text/ons-template" id="takeaway.html">
            <ons-navigator title="Navigator" var="myNavigator">
            <ons-page>
            <ons-toolbar>
            <div class="center">Take Away</div>
            </ons-toolbar>

            <ons-list ng-controller="takeAwayListCtrl">

            <ons-list-item modifier="tappable" ng-repeat="x in items">

            <ons-button ng-click="myNavigator.pushPage( {{x.page}}, { animation : 'slide' } )" modifier="large--quiet">
            {{ x.itemName }}
            </ons-button>
            </ons-list-item>

            </ons-list>

            </ons-page>
            </ons-navigator>
        </script>

我需要逃避什么吗?

1 个答案:

答案 0 :(得分:0)

我认为你不需要用x.page包裹{{ }}

直接使用它:

<ons-button ng-click="myNavigator.pushPage(x.page, { animation : 'slide' } )"