使用js數據更新textfield值使用角度js

-1

我使用角度js指令進行引導。我想要的是當用戶從項目列表中單擊編輯按鈕時，在引導模式上創建編輯表單。這裏是我的代碼：使用js數據更新textfield值使用角度js

HTML：

<div class="modal-header"> 
      <h3>Edit Template</h3> 
     </div> 
     <div class="modal-body"> 
      <form name="form" class="form-horizontal" novalidate> 
       <fieldset> 
        <div class="span4" ng-class="smClass" ng-show="etemplate.status">{{etemplate.status}}</div> 
        <div class="control-group"> 
         <label class="control-label" for="etemplateName">Name</label> 
         <div class="controls"> 
          <input class="input-xlarge" id="etemplateName" ng-model="eTemplate.name" maxlength="150" type="text" required /> 
         </div> 
        </div> 
        <div class="control-group"> 
         <label class="control-label" for="etemplateDesc">Description</label> 
         <div class="controls"> 
          <textarea id="templateDesc" id="etemplateDesc" ng-model="eTemplate.desc"></textarea> 
         </div> 
        </div> 
        <div class="center"> 
         <input type="text" style="display:none;" ng-model="eTemplate.id" value="{{eTemplate.id}}" required /> 
         <button type="button" ng-click="update(eTemplate)" class="btn btn-primary" ng-disabled="form.$invalid || isUnchanged(eTemplate)">Submit</button> 
         <button class="btn" ng-click="cancel()">Cancel</button> 
        </div> 
       </fieldset> 
      </form> 
     </div>

控制器：

controller('TemplateController', ['$scope', '$http', '$modal', function($scope, $http, $modal) { 
    var tmpId = ''; 
    $scope.openEdit = function(id) { 
     tmpId = id; 
     var editTmpModalInstance = $modal.open({ 
      templateUrl: 'editTemplateContent.html', 
      controller: 'ETModalInstance' 
     }); 

     $http({ 
      method: 'GET', 
      url: adminBaseUrl+'/get_template/', 
      params: {'id': tmpId} 
      }). 
      success(function(data, status, headers, config) { 
       $scope.$broadcast('EditTemplateDataReached', data); 
      }). 
      error(function(data, status, headers, config) { 
      }); 
    } 
}]). 

controller('ETModalInstance', ['$scope', '$http', '$modalInstance', function($scope, $http, $modalInstance) { 
    $scope.emaster = {}; 
    $scope.smClass = ''; 
    $scope.eTemplate = {}; 

    $scope.$on('EditTemplateDataReached', function(data) { 
     $scope.eTemplate = data; 
     $scope.$apply(); 
    }); 

    $scope.isUnchanged = function(eTemplate) { 
     return angular.equals(eTemplate, $scope.master); 
    }; 

    $scope.cancel = function() { 
     $modalInstance.dismiss('cancel'); 
    }; 

    $scope.update = function(eTemplate) { 
     var strng = $.param(eTemplate); 
    }; 
}]).

當所選項目的編輯按鈕ID用戶點擊我的控制器是通過我的工作，圍繞實現這一目標是向服務器發送ajax請求，然後用相應的值填充字段。但是，當返回ajax數據時，我的字段沒有填充。

來源

2013-12-13 Shayan Husaini

什麼是你的代碼的第一段控制器？ –

TemplateController是向服務器發送ajax請求的控制器。將值廣播到ETModalInstance控制器。 –

是的，但每個控制器都有不同的範圍，所以HTML模板屬於哪個控制器？另外，注意 - 'ng-model =「eTemplate.id」value =「{{eTemplate.id}}」''你不需要'value'在這裏設置，因爲ng-model會將2路數據綁定到value屬性您。 –

-1

在我的代碼中發現問題，我使用$ scope進行廣播和捕獲數據，而我必須使用$ rootScope。

錯誤：

$scope.$broadcast('EditTemplateDataReached', data); 
$scope.$on('EditTemplateDataReached', function(data) { 
     $scope.eTemplate = data; 
     $scope.$apply(); 
    });

正確：

$rootScope.$broadcast('EditTemplateDataReached', data); 
$rootScope.$on('EditTemplateDataReached', function(e, data) { 
     $scope.eTemplate = data; 
     $scope.$apply(); 
    });

來源

2013-12-13 11:45:19

使用js數據更新textfield值使用角度js

回答

相關問題