缺少生产服务器上的html元素

时间:2017-02-08 14:37:16

标签: angularjs html5 tomcat jenkins gulp

我正在开发一个JHipster生成的Angular + Spring + Java + HTML5应用程序

我有一个问题不断出现在我以前研究过的几个项目中,但我希望能够真正解决它

我有以下html模板:

<div class="form-group row">
    <label class="control-label col-md-2">ID</label>
    <div class="col-md-4">
        <input type="text" class="form-control" id="id" name="id"
               ng-model="orgLabAMR.id" readonly/>
    </div>
    <label class="control-label col-md-2">organism</label>
    <div class="col-md-4">
        <input type="text" class="form-control"
               placeholder="Search"
               ng-model="orgLabAMR.organism"
               uib-typeahead="organism as organism.organismName for organism in organisms | filter:$viewValue | limitTo:8"
               typeahead-editable="false"/>
    </div>
</div>
<div class="form-group row">
    <label class="control-label col-md-2" for="field_conventionalBloodCultureMethods">Conventional Blood Culture
        Methods</label>
    <div class="col-md-4">
        <select class="form-control" name="field_conventionalBloodCultureMethods" id="field_conventionalBloodCultureMethods" ng-model="orgLabAMR.conventionalBloodCultureMethods"
                ng-options="convBloodCulture as convBloodCulture for convBloodCulture in convBloodCultures"/>
    </div>

    <label class="control-label col-md-2" for="field_automatisedBloodCultureMethods">Automatised Blood Culture
        Methods</label>
    <div class="col-md-4">
        <select class="form-control" id="field_automatisedBloodCultureMethods" ng-model="orgLabAMR.automatisedBloodCultureMethods"
                ng-options="autoBloodCultMethod as autoBloodCultMethod for autoBloodCultMethod in autoBloodCultMethods"/>
    </div>
</div>
<div class="form-group row">
    <label class="control-label col-md-2" for="field_methodsOfIdentification">Methods Of Identification</label>
    <div class="col-md-4">
        <select class="form-control" id="field_methodsOfIdentification" ng-model="orgLabAMR.methodsOfIdentification"
                ng-options="idMethod as idMethod for idMethod in idMethods"/>
    </div>
    <label class="control-label col-md-2" for="field_identificationDetails">Identification Details</label>
    <div class="col-md-4">
        <input type="text" class="form-control" name="identificationDetails" id="field_identificationDetails"
               ng-model="orgLabAMR.identificationDetails"
        />
    </div>
</div>
<div class="form-group row">
    <label class="control-label col-md-2" for="field_standardSusceptibilityTestingMethod">Standard Susceptibility
        Testing Method</label>
    <div class="col-md-4">
       <select class="form-control" id="field_standardSusceptibilityTestingMethod" ng-model="orgLabAMR.standardSusceptibilityTestingMethod"
                ng-options="standardSuscTestMethod as standardSuscTestMethod for standardSuscTestMethod in standardSuscTestMethods"/>
    </div>

    <label class="control-label col-md-2" for="field_molecularSusceptibilityTestingMethod">Molecular Susceptibility
        Testing Method</label>
    <div class="col-md-4">
        <select class="form-control" id="field_molecularSusceptibilityTestingMethod" ng-model="orgLabAMR.molecularSusceptibilityTestingMethod"
                ng-options="molecularSuscep as molecularSuscep for molecularSuscep in molecularSusceps"/>
    </div>
</div>

<div class="form-group row">
    <label class="control-label col-md-2" for="field_automatisedSusceptibilityTestingMethod">Automatised Susceptibility
        Testing Method</label>
    <div class="col-md-4">
        <select class="form-control" id="field_automatisedSusceptibilityTestingMethod" ng-model="orgLabAMR.automatisedSusceptibilityTestingMethod"
                ng-options="automaSusceTestMethod as automaSusceTestMethod for automaSusceTestMethod in automaSusceTestMethods"/>
    </div>
    <label class="control-label col-md-2" for="field_susceptibilityTestingMethodsDetails">Susceptibility Testing Methods
        Details</label>
    <div class="col-md-4">
        <input type="text" class="form-control" name="susceptibilityTestingMethodsDetails"
               id="field_susceptibilityTestingMethodsDetails"
               ng-model="orgLabAMR.susceptibilityTestingMethodsDetails"
        />
    </div>
</div>
<div class="form-group row">
    <label class="control-label col-md-2" for="field_susceptibilityMethodsComments">Susceptibility Methods
        Comments</label>
    <div class="col-md-10">
        <input type="text" class="form-control" name="susceptibilityMethodsComments"
               id="field_susceptibilityMethodsComments"
               ng-model="orgLabAMR.susceptibilityMethodsComments"
        />
    </div>
</div>


<button class="btn btn-danger margin10" ng-click="removeOrganismLaboratoryAMR(study, orgLabAMR)">remove Organism
    Laboratory {{orgLabAMR.id}}
</button>

在localhost中加载它时,它显示所有元素都很好,如下所示:

enter image description here

但是在生产中加载它并不解析所有元素时,它会显示如下:

enter image description here

现在有趣的是,我有几个模板,就像其他实体一样,它们都可以很好地加载它们的元素。

当在浏览器中查找元素时,它不会在代码片段中显示它们,尽管在jenkins工作区中检查时html文件与本地版本中的完全相同。

1 个答案:

答案 0 :(得分:0)

尝试prod配置文件本地调试并检查gulp生成的所有缩小文件并查找其中的所有html元素后,我决定专注于标记,魔法来自更改自动崩溃{{1标签为<select />标签

现在视图完美呈现,但我仍然非常困惑,为什么这只会在生产时发生,因为浏览器完全相同。