无效的模板根错误

Question

我正在尝试$ watch一个输入元素，并且只要输入元素设置为字符串＆＃34;密码＆＃34;然后我在element.children（1）上切换类。但是，当我尝试这样做时，我得到一个无效的模板根错误..

这是我的代码..

在index.html中

 <div ng-app="app">
        <dumb-password></dumb-password>
 </div 

在app.js中，我正在写一个指令

var myapp1 = angular.module('app', []);
myapp1.directive('dumbPassword', function () {
    return {
        restrict: 'E',
        replace: 'true',
        templateUrl: 'dumbpass.html',
        link: function (scope, element) {
            scope.$watch("model.input", function (value) {
                if (value === "password") {
                    element.children(1).toggleClass("alert-box alert");
                }
            });
        }
    };
});

在我的dumbpass.html文件中

<div>
  <input type="text" ng-model="model.input">
  <div>{{ model.input }}</div>
</div>

当我在角度js中搜索上述错误时，它说，当使用模板（或templateUrl）声明指令并替换模式时，模板必须只有一个根元素，这就是我在我的情况下所做的....我无法得到问题发生的原因，而且我是棱角分明的新手。

感谢您的帮助！