Javascript 导航到Angular UI路由器状态时出现问题

我的路线定义如下：

        $stateProvider
          .state('vehicles', {
            url: '/vehicles',
            templateUrl: 'foo/bar1.html'
        }).state('vehicles.id', {
            url: '/{id}',
            templateUrl: 'foo/bar3.html'
        }).state('vehicles.create', {
            url: '/create',
            templateUrl: 'foo/bar2.html',
            controller: 'VehicleCreateController'
        });

我有一个按钮

$state.go("vehicles.create");

---

问题是，虽然URL更改正确，但页面保持不变。只有在第二次单击之后，正确的模板才会出现。

在我的同事提示我后，我意识到是状态定义导致了问题将状态重新排序从“更具体”（URL-wise-e./create）到不那么具体（/{id}）成功了。因此，错误的地方是在非常相似但不太通用的/vehicles/create之前使用更通用的URL/vehicles/{id}

下面是改进的版本：

        $stateProvider
          .state('vehicles', {
            url: '/vehicles',
            templateUrl: 'foo/bar1.html'
        }).state('vehicles.create', {
            url: '/create',
            templateUrl: 'foo/bar2.html',
            controller: 'VehicleCreateController'
        }).state('vehicles.id', {
            url: '/{id}',
            templateUrl: 'foo/bar3.html'
        });

---

使用：作为参数，如果需要，使用？使这些参数成为可选参数

请检查下面的代码段，了解如何使用params进行路由

$stateProvider
.state('contacts.detail', {
    url: "/contacts/:contactId",
    templateUrl: 'contacts.detail.html',
    controller: function ($stateParams) {
        // If we got here from a url of /contacts/42
        expect($stateParams).toBe({contactId: "42"});
    }
})