Angularjs 角材料不'；t正确加载输入_Angularjs_Angular Material

Angularjs 角材料不'；t正确加载输入

angularjs angular-material

Angularjs 角材料不'；t正确加载输入,angularjs,angular-material,Angularjs,Angular Material,我正在使用库中的Angle材质进行我的个人项目。我试着使用一个输入表单，就像我想我已经包括了这里需要的所有库： ... <link rel="stylesheet" href="bower_components/angular-material/angular-material.min.css" type="text/css"/> <script src="bower_components/angular/angular.js"></script>

我正在使用库中的Angle材质进行我的个人项目。我试着使用一个输入表单，就像

我想我已经包括了这里需要的所有库：

 ...
 <link rel="stylesheet" href="bower_components/angular-material/angular-material.min.css" type="text/css"/>
 <script src="bower_components/angular/angular.js"></script>
 <script src="bower_components/angular-animate/angular-animate.js"></script>
 <script src="bower_components/angular-aria/angular-aria.js"></script>
 <script src="bower_components/angular-messages/angular-messages.js"></script>
 <script src="bower_components/angular-material/angular-material.min.js"></script>
...
</head>
    <body>
       <div ng-app="MyApp" ng-cloak>
           <div ui-view></div>
       </div>
    </body>

。。。
...

这是我的登录页面

<div class="container page page-login">
    <md-content class="form-login">
        <md-toolbar>
            <div class="md-toolbar-tools">
                <h2>
                    <span>Login</span>
                </h2>
            </div>
        </md-toolbar>
        <br>
        <div layout="column">
            <form ng-submit="logIn()" class="md-inline-form">
                <div flex>
                    <md-input-container class="md-block">
                        <label>Username or email</label>
                        <input ng-model="user.username">
                    </md-input-container>
                </div>
                <div flex>
                    <md-input-container class="md-block">
                        <label>Password</label>
                        <input ng-model="user.password" type="password">
                    </md-input-container>
                </div>
                <div flex layout="row">
                    <md-checkbox class="remember-me md-primary" name="remember" aria-label="Remember me">
                        Remember me
                    </md-checkbox>
                    <span flex></span>
                    <md-button type="submit" class="md-raised md-primary">Login</md-button>
                    <md-button ng-href="/login/google" class="md-raised md-warn fixed-btn-link">Google+</md-button>
                </div>
            </form>
        </div>
    </md-content>

    <md-content class="form-signup">
        <md-toolbar>
            <div class="md-toolbar-tools">
                <h2>
                    <span>Do not have an account yet? Signup now!</span>
                </h2>
            </div>
        </md-toolbar>
        <br>
        <div layout="column">
            <form ng-submit="signup()" class="md-inline-form">
                <div flex>
                    <md-input-container class="md-block">
                        <label>Email*</label>
                        <input ng-model="new_user.username" required type="text">
                    </md-input-container>
                </div>
                <div flex>
                    <md-input-container class="md-block">
                        <label>Firstname</label>
                        <input ng-model="new_user.firstname" type="text">
                    </md-input-container>
                </div>
                <div flex>
                    <md-input-container class="md-block">
                        <label>Lastname</label>
                        <input ng-model="new_user.lastname" type="text">
                    </md-input-container>
                </div>
                <div flex>
                    <md-input-container class="md-block">
                        <label>Password*</label>
                        <input ng-model="new_user.password" ng-change="show_repeat_password_error = checkRepeatEmail()" required type="password">
                    </md-input-container>
                </div>
                <div flex>
                    <md-input-container class="md-block">
                        <label>Repeat password*</label>
                        <input ng-model="new_user.repeat_password" ng-change="show_repeat_password_error = checkRepeatEmail()" required type="password">
                        <md-caption ng-show="show_repeat_password_error">Passwords must match!</md-caption>
                    </md-input-container>
                </div>
                <div flex layout="row" layout-align="center" >
                    <md-button type="submit" class="md-raised md-primary">Signup</md-button>
                </div>
            </form>
        </div>
    </md-content>
</div>


登录


用户名或电子邮件
密码
记得我吗
登录
谷歌+
你还没有账户吗？现在注册！


电子邮件*
名字
姓氏
密码*
重复密码*
密码必须匹配！
报名

当我第一次访问该页面时，这是结果这种有棱角的材质与按钮、复选框和其他部件配合得很好但它与输入无关：

但是，当我重新加载页面时，它会正常工作：

我在其他页面也有这个问题。发生了什么？

谢谢您的回答。

您能在plunker上复制此错误吗？我在这里举了一个代码示例：我尝试过，但无法复制我的错误。可能它与项目中包含的一个或多个其他库存在冲突。如果您无法复制此问题，则可能表明您所说的是冲突。您还包括哪些库？在这里您可以找到我的项目的完整“索引”，其中包括所有库。在同一个pastebin文件中，您可以找到所有发出的HTTP请求：