Angular Directive不显示标签

Question

我正在为Angular中的文本字段制作指令。我已成功获得文本字段以显示和工作。根据文本区域内的内容，我会显示一条消息。由于某种原因，消息不会出现。

这是我尝试转换为指令的初始代码：

$xDefaultValue.SafeGetValue()
$yDefaultValue.SafeGetValue()
$zDefaultValue.SafeGetValue()

这是我用以下代码代替的代码：

<form name="objectiveForm">
  <p ng-if="requireObjectiveToBeSpecified"
     ng-class="{'has-error': (objectiveForm.objectiveInput.$touched || objectiveHasBeenPreviouslyEdited) && explorationObjectiveService.displayed.length < 15}">
     Add a goal: what does the exploration help people to do?
    <input name="objectiveInput" type="text" class="form-control" ng-model="explorationObjectiveService.displayed"
         placeholder="Learn how to ...">
    <span class="help-block"
         ng-show="(objectiveForm.objectiveInput.$touched || objectiveHasBeenPreviouslyEdited) && explorationObjectiveService.displayed.length < 15" style="font-size: smaller; color: #a94442">Please provide a complete sentence that describes what this exploration is about.</span>
  </p>
</form>

以下是该指令的HTML代码，文件名= exploration_objective_editor_directive.html ：

<exploration-objective-editor ng-if="requireObjectiveToBeSpecified"
    label-text="Add a goal: what does the exploration help people to do?"
    form-style="{'font-weight': 'normal'}">
</exploration-objective-editor>

这是我的指令的JS代码，文件名= ExplorationObjectiveEditorDirective.js ：

<form name="objectiveForm">
  <p ng-class="{'has-error': (objectiveForm.objectiveInput.$touched || objectiveHasBeenPreviouslyEdited) && explorationObjectiveService.displayed.length < 15}">
  <label for="explorationObjective" ng-style="<[::formStyle]>"><[::labelText]></label>
  <input id="explorationObjective" type="text"
         class="form-control protractor-test-exploration-objective-input"
         ng-model="explorationObjectiveService.displayed"
         enter code hereng-blur="onInputFieldBlur()" placeholder="Learn how to..." ng-trim="false">
  <span class="help-block" ng-show="(objectiveForm.objectiveInput.$touched || objectiveHasBeenPreviouslyEdited) && explorationObjectiveService.displayed.length < 15" style="font-size: smaller">
    <em>In a complete sentence, tell people what they'll learn from this exploration.</em>
    <span ng-if="explorationObjectiveService.displayed.length > 0">
      <em>Characters used: <[explorationObjectiveService.displayed.length]>/100</em>
    </span>
  </span>
</p>

这就是我想要的样子：

这就是它现在的样子：