AngularJS Grunt Dist HTML "Cannot read property 'length' of undefined Used --force, continuing"

Question

嗨，我有一个AngularJS应用程序，使用Grunt bower和yeoman。

我尝试在应用程序上执行grunt serve:dist。而缩小一些HTML显示错误，即使我做——force

也不会缩小

我的视图中有一些HTML页面。

application.html

<!-- build:js scripts/applicationctrl.js -->
<script src="scripts/controllers/appln.js"></script>
<!-- endbuild -->
<div ng-if="view" id="application"
    class="tab-pane active">
    <div class="box-header blue-background">
        <div class="title">
            <div class="icon-edit"></div>
            Application Information
        </div>
    </div>
    <form class="form form-horizontal " id="appForm" name="appForm"
        ng-submit="saveapplication()" ng-if="update"
        style="margin-top: 1%">
        <div ng-if="statusMessage!=null"
            class="alert {{alertType}} alert-dismissable">
            <a class="close" data-dismiss="alert" href="">× </a> <i
                class="{{statusIcon}}"></i> {{statusMessage}}
        </div>
        <div class="groupedColumns"
            ng-if="allowed">
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="control-label col-sm-4 " for="applicationName">Application
                        : <span class="required">*</span>
                    </label>
                    <div class="col-xs-7 controls">
                        <input class="form-control input-sm inline-block"
                            data-rule-required="true" ng-model="application.name"
                            placeholder="Application Name" required="required" />
                    </div>
                    <div class="availability-result">
                        <i id="loading" class="{{spinnerClass}}"></i> <span
                            class="{{msgClass}}"></span>
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-sm-4 " for="applicationID">Application
                        ID : </label>
                    <div class="col-xs-7 controls">
                        <input class="form-control input-sm"
                            ng-model="application.applicationId" id="applicationID"
                            name="applicationID" placeholder="Application ID" />
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

我有另一个文件在相同的视图文件夹。

info.html

<!-- build:js scripts/infoctrl.js -->
<script src="scripts/controllers/info.js"></script>
<!-- endbuild -->
<div class="box bordered-box" ng-if="tabpage.enable">
    <div class="box-content box-no-padding">
        <div class="responsive-table">
            <div class="box-header">
                <div class="title icon-truck">Summary</div>
            </div>
            <div class="form-group col-sm-6 no-margin-bottom">
                <label
                    class="control-label col-sm-5 col-xs-12 input-sm-attr no-padding">Active
                    : </label>
                <div>
                    <input class"no-padding" type="checkbox" ng-model="info.isActive"
                        ng-change="enablesave()">
                </div>
            </div>
            <div class="col-xs-2 actions">
                <button type="submit" id="infoSaveID"
                    ng-disabled="savebutton.enable" value="Save"
                    ng-click="saveInfo()"
                    class="btn btn-primary icon-ok icon-white">Save</button>
            </div>
            <div class="scrollable-area" style="padding-top: 5px;">
                <table class="table-condensed table table-bordered table-hover">
                    <thead>
                        <tr>
                            <th class="col-size-reduce"
                                ng-repeat="(key ,value) in infoStatus[0]">{{key}}</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="row in infoStatus">
                            <td class="col-size-reduce" ng-repeat="(key, value) in row">
                                {{value}}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

我也有很多这样的文件。

当我执行grunt serve:dist时，它会缩小第一个html页面。在缩小info.html页面时显示错误

Warning: dist/views/info.html
Parse Error: <input class"no-padding" type="checkbox" ng-model="info.isActive"
                        ng-change="enablesave()">
                </div>
            </div>
            <div class="col-xs-2 actions">
                <button type="submit" id="infoSaveID"
                    ng-disabled="savebutton.enable" value="Save"
                    ng-click="saveInfo()"
                    class="btn btn-primary icon-ok icon-white">Save</button>
            </div>
            <div class="scrollable-area" style="padding-top: 5px;">
                <table class="table-condensed table table-bordered table-hover">
                    <thead>
                        <tr>
                            <th class="col-size-reduce"
                                ng-repeat="(key ,value) in infoStatus[0]">{{key}}</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="row in infoStatus">
                            <td class="col-size-reduce" ng-repeat="(key, value) in row">
                                {{value}}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div> Used --force, continuing.
Warning: Cannot read property 'length' of undefined Used --force, continuing.

为什么第一个工作正常，第二个显示错误?如何解决?

Answer 1

你的HTML语法有错误。在第一行，替换

<input class"no-padding" type="checkbox" ng-model="info.isActive"
                        ng-change="enablesave()">

<input class="no-padding" type="checkbox" ng-model="info.isActive"
                        ng-change="enablesave()">

和htmlmin将正常工作