带有 2 个控件的 html 文件答案

【问题标题】：html file coming up with 2 controls带有 2 个控件的 html 文件
【发布时间】：2014-11-11 04:04:28
【问题描述】：

我有一个 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('/');
    })

【问题讨论】：

angular.module('test', ['ui.router']) .config(function($stateProvider, $urlRouterProvider) { $stateProvider .state('register', { url: '/ register', templateUrl: '../partials/register.html', 控制器: 'registration' }); $stateProvider.state('login',{ url: '/login', templateUrl: '../partials/login .html', 控制器: '登录' }); $urlRouterProvider.otherwise('/'); })
不确定这是否是问题所在，但此处缺少模块名称：<form ng-app="" ng-controller="validateCtrl" name="loginForm" novalidate>。使用：ng-app="teste".
但我有另一个 html 文件，其中的控件也作为双..

标签： html angularjs forms

【解决方案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>

【讨论】：

让它工作了.....有一些用 angular.min.js 编写的模棱两可的代码，这就是导致问题的原因。我删除了整个文件并且工作正常。