AngularJS Unknown TypeError:无法读取属性' 1'无效

时间:2015-01-20 07:55:20

标签: javascript angularjs

下面是我遇到问题的代码:

//Main Codes for the Diary App

(function () {
//Create a new diary app
var diary = angular.module('diary', ['ngRoute']);

//Define a Router for the App
diary.config(function ($routeProvider) {
        $routeProvider.


            when('/', {
                templateUrl: 'partials/wall.php',
                controller: 'DiaryWallController'
            }).


            when('/images', {
                templateUrl: 'partials/images.html',
                controller: 'DiaryImagesController'
            }).


            when('/audio', {
                templateUrl: 'partials/audio.html',
                controller: 'DiaryAudioController'
            }).


            otherwise({
                redirectTo: '/'
            });
});

//Define Controllers
diary.controller('DiaryWallController', function($scope) {
    $scope.message = "Lets do this!! Wall of this site";
});

diary.controller('DiaryImagesController', function($scope) {
    $scope.message = "Lets do this!! Images of this site";
});

diary.controller('DiaryAudioController', function($scope) {
    $scope.message = "Lets do this!! Audio of this site";
});})();

我收到此未知类型错误:无法读取属性' 1' NuLL。 它成功获取路由中指定的文件,但它没有在网站中显示..我检查了控制台:

XHR finished loading: GET "http://localhost/mobile%20diary/app/partials/images.html". 

但是加载页面的内容不会显示在网站中。 我检查了资源,并在那里加载了images.html文件,我可以看到文件预览,但它没有显示在网站中。

以下是HTML Shell文件:

<!DOCTYPE html>
<html ng-app="diary">
<head lang="en" ng-controller="">
<meta charset="UTF-8">
<link rel="stylesheet" href="css/bootstrap.css" type="text/css">
<link rel="stylesheet" href="css/style.css" type="text/css">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title></title>
</head>
<body>


<header>
<nav class="menu-nav">
    <ul>
        <li class="menu-buttons"><a href="#" id="selected"><i class="fa fa-newspaper-o"></i></a></li>
        <li class="menu-buttons"><a href="#images"><i class="fa fa-file-text-o"></i></a></li>
        <li class="menu-buttons"><a href="#audio"><i class="fa fa-image"></i></a></li>
        <li class="menu-buttons"><a href=""><i class="fa fa-microphone"></i></a></li>
        <li class="menu-buttons"><a href="" id="selected"><i class="fa fa-navicon"></i></a></li>
    </ul>
</nav>
</header>

<div ng-view>

</div>


<script src="js/angular.js"></script>
<script src="js/angular-route.min.js"></script>
<script src="js/app.js"></script>
</body>
</html>

2 个答案:

答案 0 :(得分:9)

我也有同样的错误,类似于@ChanX的评论我在ng-controller属性中出错了。在我的情况下,我不小心添加了一个css类的名称,我打算将这个类属性放入ng-controller属性中。

我的假设是,在解析ng-controller属性时,如果出现问题,您可能会看到此错误。无论如何,我很高兴我在SO上找到了它,因为这是一个真正令人头疼的问题。如果错误消息提供更多信息,那就太好了。

答案 1 :(得分:0)

这似乎是因为您使用的是localhost网址。可能用于调试或开发环境。

在content_script.js上有一个函数如下:

function scanLinks() {
  var current_domain = document.location.href.match(/^https?:\/\/(?:www\.)?([^\.]+\.[^\/]+)/i);

  $("a[href][muse_scanned!=true]").each(function(i) {
    this.setAttribute("muse_scanned", true);
    var href = this.href;
    var domain = href.match(/^http:\/\/(?:(?:www\.)?(?:[^\.]+\.(notlong\.com|qlnk\.net|ni\.to|lu\.to|zzang\.kr)|([^\.]+\.[^\/]+)))/i);
    if (domain) {
      domain = domain[1] || domain[2] || false;
    }
    if ((domain != current_domain[1]) && (expandSvcList.indexOf(domain) > -1)) {
      this.title = "Expanding URL...";
      expandLink(this);
    }
  });
}

重要的部分是:

var current_domain = document.location.href.match(/^https?:\/\/(?:www\.)?([^\.]+\.[^\/]+)/i);

检查您当前的链接,在您的情况下为“http://localhost/ ...”查找有效的网址,例如“http:// www .localhost /”。因为情况并非如此,所以在访问current_domain[1]时会导致错误,因为current_domain为空。