Question

我有一个app.js文件，我已经使用angular定义了一些路由，在app.js中我调用了一些html文件。当我运行teh文件时，它正在加载2个控件。 Menas我有登录表单，我已经定义了2个文本框和1个提交按钮，但是当我运行该文件时，它会出现2个控件。

以下是我的login.html文件：

![<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>Login</title>
</head>
<body>
<form  ng-app=""  ng-controller="validateCtrl"
       name="loginForm" novalidate>

<p>UserName:<br>
    <input type="text" name="uName" ng-model="uName" required>
  <span style="color:red" ng-show="loginForm.uName.$dirty && loginForm.uName.$invalid">
  <span ng-show="loginForm.uName.$error.required">Username is required.</span>
  </span>
</p>

<p>Password:<br>
    <input type="text" name="pwd" ng-model="pwd" required>
  <span style="color:red" ng-show="loginForm.pwd.$dirty && loginForm.pwd.$invalid">
  <span ng-show="loginForm.pwd.$error.required">Password is required.</span>
  </span>
</p>

<p>
    <input type="submit" ng-click="popupuser()"
           ng-disabled="loginForm.pwd.$dirty && loginForm.pwd.$invalid ||
               loginForm.uName.$dirty && loginForm.uName.$invalid ">
</p>

</form>
</body>
</html>][1]

app.js：

angular.module('test', ['ui.router'])
    .config(function($stateProvider, $urlRouterProvider) {

        $stateProvider
            .state('register', {
                url: '/register',
                templateUrl: '../partials/register.html',
                controller: 'registration'
            });
        $stateProvider.state('login',{
            url: '/login',
            templateUrl: '../partials/login.html',
            controller: 'login'
        });

        $urlRouterProvider.otherwise('/');
    })

Answer 1

这应该是一个“部分”文件，但看起来像一个完整的HTML文件。最大的问题似乎是ng-app属性，因为可能已经在index.html文件中定义了两个ng-app属性！

您需要将您的登录html文件视为将插入另一个html文件的内容。

你应该写这样的登录html文件：

<form  ng-controller="validateCtrl"
   name="loginForm" novalidate>

<p>UserName:<br>
  <input type="text" name="uName" ng-model="uName" required>
  <span style="color:red" ng-show="loginForm.uName.$dirty && loginForm.uName.$invalid">
    <span ng-show="loginForm.uName.$error.required">Username is required.</span>
  </span>
</p>

<p>Password:<br>
  <input type="text" name="pwd" ng-model="pwd" required>
  <span style="color:red" ng-show="loginForm.pwd.$dirty && loginForm.pwd.$invalid">
    <span ng-show="loginForm.pwd.$error.required">Password is required.</span>
  </span>
</p>

<p>
  <input type="submit" ng-click="popupuser()"
       ng-disabled="loginForm.pwd.$dirty && loginForm.pwd.$invalid ||
           loginForm.uName.$dirty && loginForm.uName.$invalid ">
</p>

</form>

html文件出现2个控件

1 个答案: