Question

我正在尝试建立一个基于参数提供5种状态的状态。

这是app.js：

.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/');
$stateProvider

.state('home' , {
    url:'/',
    templateUrl: 'home.html'
})
.state('car' , {
    url:'/car/:carId',
    templateUrl: 'car{{carId}}.html',
    controller: function($scope, $stateParams) {
        $scope.carId = $stateParams.carId;
    }
  });
})

带有ID的网址有效，但我如何为html网页的模板网址执行相同操作，因为现在我的所有5个列表项状态都显示相同的内容。

列出5个项目，我称之为状态示例：

<a class="item" ui-sref="car({ carId: 1})">
   Car 1
</a>

问题出在templateUrl的id的脚本定义中：

<script type="text/ng-template" id="car{{carId}}.html">
  <ion-view view-title="Car 1"> 
    <ion-content>
        <h1>car1</h1>
    </ion-content>
  </ion-view>
</script>

是否可以在id和app.js templateUrl的脚本定义中传递carId，以便每个页面都有不同的内容？

Answer 1

您必须使用ui-router wiki：

中所述的功能定义templateUrl

$stateProvider.state('contacts', {
  templateUrl: function ($stateParams){
    return '/car' + $stateParams.carId + '.html';
  }
})

具有params的离子状态

1 个答案: