AngularJS - 无法读取undefined的属性'navigable'

时间:2014-07-20 04:48:40

标签: angularjs angular-ui-router

我的app.run:

app.run([
'$q', '$rootScope', '$state', 'settings', 'datacontext',
function ($q, $rootScope, $state, settings, datacontext) {
    settings.currentLang = settings.languages[0];
    breeze.core.extendQ($rootScope, $q);
    datacontext.getSideMenuItems().then(function (data) {
        var startUp = undefined;
        var rootUrl = '/app/views/';

        /// this is the upper level used for side menu only
        angular.forEach(data, function (value) {  
            // now loop thru the data for the $state items
            angular.forEach(value.viewStates, function (viewState, key) {

            if (key == 0) {
                startUp = viewState.name;
            }

            var state = {
                "url": '/' + viewState.name,
                "parent": viewState.parentName,
                "abstract": viewState.isAbstract,
                "views": {}
            };

            angular.forEach(viewState.views, function (view) {
                state.views[view.name] = {
                    controller: view.controllerName,
                    templateUrl: rootUrl + view.templateUrl + '.html'
                };
            });

            $stateProviderRef.state(viewState.name, state);
        });
        $state.go(startUp);
        });
    });
}

我的数据:[作为JSON表示,忽略大写,微风将它们重命名为小写]

[{
"$id": "1",
"Id": 2,
"Icon": "fa-home",
"IsActive": "active",
"IsShared": false,
"OrderNum": 1000,
"Title": "Dashboards",
"FK_DbModuleId": 1,
"DBoardModule": null,
"ViewStates": [
    {
        "$id": "2",
        "Id": 2,
        "IsAbstract": false,
        "Name": "PersDboards01",
        "ParentName": "root",
        "OrderNum": 1,
        "FK_ViewGroupId": 2,
        "ViewGroup": {
            "$ref": "1"
        },
        "Views": [
            {
                "$id": "3",
                "Id": 4,
                "ControllerName": "MyDashboardCtrl",
                "Name": "container@",
                "TemplateUrl": "dashboards/myDashboard",
                "FK_ViewStateId": 2,
                "ViewState": {
                    "$ref": "2"
                }
            },
            {
                "$id": "4",
                "Id": 5,
                "ControllerName": "LeftPanelCtrl",
                "Name": "leftPanel@",
                "Title": "null",
                "TemplateUrl": "shell/html/left-panel",
                "FK_ViewStateId": 2,
                "ViewState": {
                    "$ref": "2"
                }
            }
        ]
    }
] 

我知道Json的属性已大写,但我并没有真正使用JSON,我只是将其从fiddler中复制而来,这是从我的Web API获得的。

我理解错误“无法读取属性'导航'未定义”意味着在定义父状态后我没有定义子状态,但我看不到我在做什么。

有没有人知道构建app.run的更好方法?

更新

我发现了我的错误,见下文。

3 个答案:

答案 0 :(得分:2)

<强>解决:

确实错误是由于我在建立父状态之前创建子状态。

我查看了我的数据库,发现我的帐号中的父状态最后

Id:150
IsAbstract:1
名称:“根”
ParentName:“”
 .....

如果我确保首先解决问题就不会发生。

Id:1
IsAbstract:1
名称:“根”
ParentName:“”
 .....

我认识到这种情况除了提醒你确保你的父状态是你创建动态状态/视图时循环中的第一个状态时,对其他许多人没有帮助

答案 1 :(得分:0)

上面包含的代码未引用“可导航”字样。所以,它不能成为这个错误的根源。请包含正在进行引用的其他文件,或者更好的是,发布说明问题的Plunkr。

我发布这个作为答案而不是评论,因为有一个额外的细节可以帮助您找到错误的实际来源,并且您可能会发现您不需要找到它的任何进一步帮助。在Angular中,很难找到错误的位置。它的许多机制都有很深的&#34;调用堆栈,尤其是当注入器或摘要循环触发错误时。你最终发现的是错误本身就发生在你想象的其他地方。

我认为您可能遇到此处报告的相同错误: https://github.com/angular-ui/ui-router/issues/488

您似乎将AngularJS与Angular UI Router和Breeze一起使用。报告的错误与您的错误相同,如果您重新检查您的代码并按照其他人在该主题上报告的内容,我认为您会发现您的问题是可修复的...但与您的实际代码几乎没有任何关系以上!

答案 2 :(得分:0)

此处的问题与处理期间错误的案例JSON属性命名有关。有一个工作plunker - 在JSON处理结束时调用console.log(state)来显示结果(不要忘记用F12启动控制台)

代码段比较就像这样

angular.forEach(response.data, function (value) {

    // NO viewStates
    // but ViewStates
    angular.forEach(value.ViewStates, function (viewState, key) {

        if (key == 0) {
            startUp = viewState.Name;         // instead of name
        }

        var state = {
            "url": '/' + viewState.Name,      // instead of name
            "parent": viewState.ParentName,   // instead of parentName
            "abstract": viewState.IsAbstract, // instead of isAbstract
            "views": {}
        };

        // No views
        // but Views
        angular.forEach(viewState.Views, function (view) {
            state.views[view.Name] = {
                controller: view.ControllerName,  // instead of controllerName
                templateUrl: rootUrl + view.TemplateUrl + '.html'
            };
        }); 
        $stateProviderRef.state(viewState.Name, state);  // instead of name
        console.log(state) 
    });
});

因为JSON就是这样(参见开头的大写):

"ViewStates": [{
  "IsAbstract": false,
  "Name": "PersDboards01",
  "ParentName": "root",
  ...
  },
  "Views": [{
    "ControllerName": "MyDashboardCtrl",     // ControllerName
    "Name": "container@",                    // Name
    "TemplateUrl": "dashboards/myDashboard", // Templateurl
    ...

工作plunker plunker (只是将结果记录到控制台中) 表明其余代码应该正常工作