我的 AngularJs 代码有问题

戈帕尔·克希尔萨加尔

我是 Angularjs 的新手,下面是我的代码,

<!DOCTYPE html>
<html>
    <head>
        <title>ng-Messages Service</title>
        <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>
        <script src='https://code.angularjs.org/1.5.0-rc.0/angular.min.js'></script>
        <script src='https://code.angularjs.org/1.5.0-rc.0/angular-messages.min.js'></script>
        <script src="ng-messages.js"></script>
    </head>

    <body>

        <div ng-controller='thecontroller'>
            <form name="myForm">
            <label>
              Enter text:
              <input type="text" ng-model="field" name="myField" required minlength="5" />
            </label>
            <div ng-messages="myForm.myField.$error" role="alert">
              <div ng-message="required">You did not enter a field</div>
              <div ng-message="minlength, maxlength">
                Your email must be between 5 and 100 characters long
              </div>
            </div>
            </form>
        </div>
    </body>
</html>

下面是angularjs代码,

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

myApp.controller('thecontroller',function($scope){
    $scope.name="Gopal";
});

我们没有得到正确的输出,我上面的代码有什么问题。

谢谢

萨吉塔兰

你没有ng-app="myApp"在你的 html 模板中提到

还要确保您引用了所需的 .js 文件。我假设这包括模块声明。

<script src="ng-messages.js"></script>

演示

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

myApp.controller('thecontroller',function($scope){
    $scope.name="Gopal";
});
<!DOCTYPE html>
<html>
    <head>
        <title>ng-Messages Service</title>
        <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>
        <script src='https://code.angularjs.org/1.5.0-rc.0/angular.min.js'></script>
        <script src='https://code.angularjs.org/1.5.0-rc.0/angular-messages.min.js'></script>
    </head>
    <body ng-app="myApp">

        <div ng-controller='thecontroller'>
            <form name="myForm">
            <label>
              Enter text:
              <input type="text" ng-model="field" name="myField" required minlength="5" />
            </label>
            <div ng-messages="myForm.myField.$error" role="alert">
              <div ng-message="required">You did not enter a field</div>
              <div ng-message="minlength, maxlength">
                Your email must be between 5 and 100 characters long
              </div>
            </div>
            </form>
        </div>
    </body>
</html>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章