2017-02-21 62 views
0

У меня проблема. Не так много отличается от шаблонных углов. Но я все еще смущен. Я сделал одну форму и использовал ее по двум причинам. Необходима форма обновления и добавление формы. Если заголовок обновить данные (форма обновления), результат ожидается, как я хочу. Но если заголовок добавить данные (добавить форму) не работает. Проблема в том, что я вызываю $scope.label -> просто пример. Результат не определен, я не знаю, как это сделать. Но если данные обновления (форма обновления) являются правильными и хорошими. Любое решение для меня? или мой логический шаблон неверен? Как мне сделать, чтобы решить мою проблему? БлагодаряКак сделать одну форму, но можно использовать с двумя необходимостью (Angular JS)

И это мой код:

form.html (Partial Мой шаблон)

<div class="row"> 
    <div class="col-md-12"> 
     <div class="portlet light"> 
      <div class="portlet-title"> 
       <div class="caption"> 
        <i class="fa fa-edit font-pink-sharp"></i> 
        <span class="caption-subject font-pink-sharp bold uppercase"> 
         Form Editable 
        </span> 
       </div> 
      </div> 
      <div class="portlet-body form"> 
       <div class="form-horizontal"> 
        <div class="form-body"> 

         <div ng-include="GetDataForm()"></div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

ФОРМА трендовом TAG HTML

Форма
<div class="form-group" ng-show="showId"> 
    <label class="control-label col-md-3">ID Trending Tag</label> 
    <div class="col-md-6"> 
     <input type="text" name="id" class="form-control" ng-model="id" disabled></input> 
    </div> 
</div> 
<div class="form-group"> 
    <label class="control-label col-md-3">Label</label> 
    <div class="col-md-6"> 
     <input type="text" name="label" class="form-control" ng-model="label"></input> 
    </div> 
</div> 
<div class="form-group"> 
    <label class="control-label col-md-3">Active</label> 
    <div class="col-md-6"> 
     <label class="checkbox-inline"> 
      <input type="checkbox" ng-model="active0.type.checked"> 0 
     </label> 
     <label class="checkbox-inline"> 
      <input type="checkbox" ng-model="active1.type.checked"> 1 
     </label> 
    </div> 
</div> 
<div class="form-group"> 
    <label class="control-label col-md-3">Slot</label> 
    <div class="col-xs-1"> 
     <input type="text" name="username" class="form-control" ng-model="slot"></input> 
    </div> 
</div> 
<input type="hidden" name="userfile" file-model="userfile"></input> 
<div class="form-group"> 
    <label class="control-label col-md-3">URL</label> 
    <div class="col-md-6"> 
     <input type="text" name="url" class="form-control" ng-model="url"></input> 
    </div> 
</div> 
<div class="form-group"> 
    <label class="control-label col-md-3">Target</label> 
    <div class="col-md-6"> 
     <input type="text" name="target" class="form-control" ng-model="target"></input> 
    </div> 
</div> 
<div class="form-group"> 
    <label class="control-label col-md-3">Tracker</label> 
    <div class="col-md-6"> 
     <input type="text" name="target" class="form-control" ng-model="tracker"></input> 
    </div> 
</div> 
<div class="form-actions"> 
    <div class="row"> 
     <div class="col-md-offset-8 col-md-3"> 
      <button type="submit" class="btn pink" ng-click="UpdateTrendingTag()" ng-show="showButton">Update</button> 
      <button type="submit" class="btn pink" ng-click="SaveTrendingTag()" ng-hide="showButton">Save</button> 

      <button type="button" class="btn default">Cancel</button> 
     </div> 
    </div> 
</div> 

Контроллер Update

$scope.getDataTrendingTag = function (data){ 

     $scope.showId = false; 
     $scope.showId = !$scope.showId; 

     $scope.showButton = false; 
     $scope.showButton = !$scope.showButton; 

     $scope.getInclude = function() { 
      return 'templates/form.html'; 
     }; 

     $scope.GetDataForm = function() { 
      return 'templates/form-trending-tag.html'; 
     }; 

}; 

контроллер Добавление Форма

$scope.CreateTrendingTag = function() { 

     $scope.showId = true; 
     $scope.showId = !$scope.showId; 

     $scope.showButton = true; 
     $scope.showButton = !$scope.showButton; 

     $scope.getInclude = function() { 
      return 'templates/form.html'; 
     }; 

     $scope.GetDataForm = function() { 
      $scope.label = ""; 
      $scope.active0 = { 
       type: { 
        checked: false 
       } 
      }; 

      $scope.active1 = { 
       type: { 
        checked: false 
       } 
      }; 
      $scope.slot = ""; 
      $scope.url = ""; 
      $scope.target = ""; 
      $scope.tracker = ""; 

      return 'templates/form-trending-tag.html'; 
     }; 
    }; 

ответ

0

Это происходит потому, что при использовании нг-включают есть новый Детский Scope создан

Что вы можете сделать, это:

1) Использование объект, а не $scope.label, вы можете сделать $scope.data = {}, а затем установить ng-model на data.label

Fiddle with object

2) Используйте $parent (не так рекомендуется)

как этот ng-model="$parent.label"

Fiddle with parent

Если Вы ng-include в качестве ng-include Вам нужно $parent.$parent.label

Надежда это помогает

Вы можете прочитать здесь о размахе и нг-incluce Ng-Include and Scope

С уважением

+0

Хммм Стараюсь свое решение, но не работает – userpr

+0

Что не работает вы до сих пор не определено получение в $ scope.data.label? – stackg91

+0

Да, я получил undefined в моем console.log – userpr