TypeError:undefined不是Angular函数

时间:2014-05-03 09:12:40

标签: javascript jquery angularjs

我是angular.js的初学者,并尝试在angular.js的帮助下创建一个动态模板,但每次执行代码时我都会发现这个错误并不了解问题所在.Below是我的代码。任何帮助都很明显。 的错误

TypeError:undefined is not a function

at linker (~/Scripts/controllers.js:30:63)
at ~/Scripts/angular.js:6758:44
at nodeLinkFn (~/Scripts/angular.js:6350:13)
at compositeLinkFn (~/Scripts/angular.js:5761:15)
at publicLinkFn (~/Scripts/angular.js:5666:30)
at boundTranscludeFn (~/Scripts/angular.js:5780:21)
at controllersBoundTransclude (~/Scripts/angular.js:6371:18)
at ngRepeatAction (~/Scripts/angular.js:19788:15)
at Object.$watchCollectionAction [as fn] (~/Scripts/angular.js:11908:13)
at Scope.$digest (~/Scripts/angular.js:12031:29) <content-item ng-repeat="item in content" content="item" class="ng-scope ng-isolate-scope"> 

这是我的代码

<html xmlns="http://www.w3.org/1999/xhtml" ng-app="myApp" class="ng-scope">
  <head runat="server">
<title>Index</title>
<script src="../../Scripts/angular.js" type="text/javascript"></script>
<script src="../../Scripts/controllers.js" type="text/javascript"></script>
</head>
<body>
    <div id="container" ng-controller="ContentCtrl">
        <content-item ng-repeat="item in content" content="item"></content-item>
    </div>
</body>
</html>

Jquery代码

var app = angular.module('myApp', []);

app.directive('contentItem', function ($compile) {    
var imageTemplate = '<div class="entry-photo"><h2>&nbsp;</h2><div class="entry-img"><span><a href="{{rootDirectory}}{{content.data}}"><img ng-src="{{rootDirectory}}{{content.data}}" alt="entry photo"></a></span></div><div class="entry-text"><div class="entry-title">{{content.title}}</div><div class="entry-copy">{{content.description}}</div></div></div>';
var videoTemplate = '<div class="entry-video"><h2>&nbsp;</h2><div class="entry-vid"><iframe ng-src="{{content.data}}" width="280" height="200" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe></div><div class="entry-text"><div class="entry-title">{{content.title}}</div><div class="entry-copy">{{content.description}}</div></div></div>';
var noteTemplate = '<div class="entry-note"><h2>&nbsp;</h2><div class="entry-text"><div class="entry-title">{{content.title}}</div><div class="entry-copy">{{content.data}}</div></div></div>';

var getTemplate = function (contentType) {
    var template = '';

    switch (contentType) {
        case 'image':
            template = imageTemplate;
            break;
        case 'video':
            template = videoTemplate;
            break;
        case 'notes':
            template = noteTemplate;
            break;
    }

    return template;
}

var linker = function (scope, element, attrs) {
    scope.rootDirectory = 'images/';

    element.html(getTemplate(scope.content.content_type)).show();
    $compile(element.contents())(scope);
}

return {
    restrict: "E",
    rep1ace: true,
    link: linker,
    scope: {
        content: '='
    }
};

});

function ContentCtrl($scope, $http) {
"use strict";
$scope.url = 'content.json';
$scope.content = [];    
$scope.fetchContent = function () {
    $http({ method: 'POST', url: '/Angular/GetData' }).
    success(function (data, status, headers, config) {
        console.log('HELLO! ' + data.data);
        $scope.content = data.data;
    }).
    error(function (data, status, headers, config) {
        alert("error");
    });
}

$scope.fetchContent();
}

1 个答案:

答案 0 :(得分:2)

可能 rep1ace 不对吗?

 return {
        restrict: "E",
        rep1ace: true,
        link: linker,
        scope: {
            content: '='
        }

return {
    restrict: "E",
    replace: true, //why rep1ace :D !?
    link: linker,
    scope: {
        content: '='
    }

然后afaik, alert(); 应该是undefined角度你应该使用 $ window.alert(),检查是否删除警报如果是,请使用$ window wrapper

无论如何,如果您的错误在controllers.js上返回:30显示您在该行的内容:)