Angular UI 路由器错误无法从 'parent' 解析 'child.state'

Angular UI router error Could not resolve 'child.state' from 'parent'

我在 angular ui 路由器尝试加载状态时遇到上述错误。我正在尝试使用垂直选项卡,单击它们会在选项卡旁边提供详细信息。我正在使用 resolve 从我的服务中按 id 获取详细信息。 下面是我的路由配置

        .state('franchise', {
            url: "/franchise",
            controller: "FranchiseCtrl",
            templateUrl: "tpl/franchise.html"
        })
        .state('franchise.detail', {
            params: {
                franchiseId : "defaultId", 
                franchiseName: "defaultName"
            },
            url: "/:franchiseName",
            controller: function($scope, fran) {
                $scope.franchiseDetail = fran;
            },
            templateUrl: "partials/franchise-detail.html",
            resolve: {
                fran:  function($http, $stateParams) {
                    var url = "path/to/my/service" + $stateParams.franchiseId;
                    return $http.get(url)
                        .then(function(res){ return res.data; });
                }
            }
        })

这是我parent的模板

<ul>
   <li ng-repeat="franchise in franchises">
      <a ui-sref="frachise.detail({ franchiseId: franchise.id,
                                    franchiseName: franchise.name })">
         Franchise {{ franchise.name }}
      </a>
   </li>
</ul>

我已经尝试将我的决心放在 parent 中,但它一直给出同样的错误。

你的franchise这个词打错了(你错过了'n'),应该是:

<a ui-sref="franchise.detail({ franchiseId: franchise.id, franchiseName: franchise.name })">
      Franchise {{ franchise.name }}
</a>