我正在阅读 ui-router 文档。我对我试图用 ui-sref 做的事情有一个不错的感觉。在底部td中,我将 ui-sref 添加到所需的 href。我确保调用我想要触发的状态,括号是我试图创建的路由参数。
问题是我得到了语法错误:令牌'。' 位于Angular 文档中从[{4}] 开始的表达式 [{3}] 的第 {2} 列。
我确保参考一些附加信息,以防我在代码的任何部分中丢失。
<div class="row" >
<div class="panel panel-primary">
<div class="panel-heading">
Customer List
</div>
<div class="panel-body">
Filter: <input type="text" ng-model="customerFilter">
</div>
<table class="table table-striped table-responsive">
<tr>
<th ng-click="ctrl.doSort('name')">Name</th>
<th ng-click="ctrl.doSort('city')">City</th>
<th ng-click="ctrl.doSort('orderTotal')">order total</th>
<th ng-click="ctrl.doSort('joined')">joined</th>
<th> </th>
</tr>
<tr data-ng-repeat = "cust in ctrl.customers |filter: customerFilter| orderBy:ctrl.sortBy:ctrl.reverse">
<td>{{cust.name | uppercase}}</td>
<td>{{cust.city}}</td>
<td>{{cust.orderTotal | currency}}</td>
<td>{{cust.joined |date}}</td>
<td><a ui-sref="orders({ctrl.cust.id})">View Orders</a></td>
</tr>
</table>
</div>
<span>Total customers: {{ctrl.customers.length}}</span>
</div>
这是我的控制器的顶部。我正在使用 controllerAs 并尝试更习惯于 John Papa 风格指南
angular
.module('app.customers')
.controller('CustomerController', CustomerController);
function CustomerController($stateParams) {
var vm = this;
// customerId comes from url param
console.log($stateParams);
var customerId = $stateParams.customerId;
vm.orders = null;
我正在为 $stateParams 取回一个空对象
我的路线文件已尽可能具体地分解。我创建了一个视图对象,创建了一个主视图并在 html 中引用了它。我做了一个解析对象,它将采用 $stateParams
angular
.module('app.customers')
.config(config);
function config($stateProvider) {
console.log('customers route')
$stateProvider
.state('customers',{
url:'/customers',
views: {
"main@": {
templateUrl: './components/customers/customers.html',
controller: 'CustomerController',
controllerAs: 'ctrl'
}
},
resolve: {
customerId: ['$stateParams', function($stateParams) {
return $stateParams.customerId;
}]
}
})
};
但是,我只是去我创建的没有数据的 templateUrl 并且 url 没有获取 id。
这是我的订单控制器
(function() {
'use strict';
angular
.module('app.orders')
.controller('OrdersController', OrdersController);
function OrdersController($stateParams) {
console.log('in orders');
var vm = this;
vm.title = "Customer Orders";
}
}());
这是我为订单设置的路线。我确保参考:Id每个联系人 ID。
(function() {
'use strict';
angular
.module('app.orders')
.config(config);
function config($stateProvider) {
$stateProvider
.state('orders',{
url:'/orders:customerId',
templateUrl: './components/orders/orders.html',
controller: 'OrdersController',
controllerAs: 'ctrl'
})
// $locationProvider.html5Mode(false);
};
})();