Question

我这里有一个简短的待办事项列表程序。它工作得很好，除了大写过滤器以大写每个字符串的第一个单词。它引起了注射器错误的标记，但我真的不知道它是不合适的。

<!--TOOD LIST HTML -->
<div ng-controller="todoController" id="todoCTRL">
<form name="frm" ng-submit="addTodo()">
    <input type="hidden" name="newtodo" ng-model="newTodo" required />
</form>

<ol>
    <li ng-repeat="todo in todos" id="listoftodos">
        <span>{{todo.title | capitalize}}</span>
    </li>
</ol>
</div>
<!-- TOOD LIST END HTML -->

<!-- TODOLIST JS -->
<script>
// TODOLIST JS
var app = angular.module('ToDo',[]);
app.controller('todoController',['$scope',function($scope){
$scope.todos = [

];

$scope.addTodo = function(){
    $scope.todos.push({'title':$scope.newTodo})
    $scope.newTodo = ''
}

app.filter('capitalize', function() {
 return function(input) {
  return (!!input) ? input.charAt(0).toUpperCase() + input.substr(1).toLowerCase() : '';
}
});

// TODOLIST END JS

更新

这是实际错误。

angular.js：13294错误：[$ injector：unpr] http://errors.angularjs.org/1.5.2/ $ injector / unpr？p0 = capitalizeFilterProvider％20％3C-％20capitalizeFilter 在错误（本机）在https://code.angularjs.org/1.5.2/angular.min.js:6:416 在https://code.angularjs.org/1.5.2/angular.min.js:43:7 在Object.d [as get]（https://code.angularjs.org/1.5.2/angular.min.js:40:270）在https://code.angularjs.org/1.5.2/angular.min.js:43:69 在Object.d [as get]（https://code.angularjs.org/1.5.2/angular.min.js:40:270）在https://code.angularjs.org/1.5.2/angular.min.js:157:155 在V（https://code.angularjs.org/1.5.2/angular.min.js:118:262）在https://code.angularjs.org/1.5.2/angular.min.js:116:359 at p（https://code.angularjs.org/1.5.2/angular.min.js:7:355)(anonymous function）@ angular.js：13294（匿名函数）@ angular.js：10007m。$ digest @ angular.js：16757m。$ apply @ angular.js：17003commands.new item * val @ （索引）：76d.onresult @ annyang.min.js：6 35www-widgetapi.js：98无法执行＆＃39; postMessage＆＃39;在＆＃39; DOMWindow＆＃39;：提供的目标来源（＆＃39; https://localhost＆＃39;）与收件人窗口的来源不匹配（＆＃39; http://localhost ＆＃39;）。gK @ www-widgetapi.js：98g.O @ www-widgetapi.js：95

JSFIDDLE

Answer 1

当你ToDo.filter想要ToDo来引用你的角度模块时，从代码看它将被分配给控制器。你希望它看起来像：

var ToDo = angular.module('ToDo',[]);
ToDo.controller(...);
ToDo.filter(...);

Answer 2

看起来您的javascript形式不正确 - 您的控制器未正确关闭。此外，我建议在链接模块或创建app变量并定义模块之间保持一致。试试这个：

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

ToDo.controller('todoController', ['$scope',function($scope){
    $scope.todos = [];

    $scope.addTodo = function() {
        $scope.todos.push({'title':$scope.newTodo});
        $scope.newTodo = '';
    }
}]);

ToDo.filter('capitalize', function() {
    return function(input) {
        return (!!input) ? input.charAt(0).toUpperCase() + input.substr(1).toLowerCase() : '';
    }
});

AngularJS单词大写过滤器

2 个答案: