如何將grails json數據作爲指令屬性值傳遞給angularjs指令

我想將Angular的自定義元素指令中的Grails JSON對象作爲屬性值傳遞給Angular指令。我試過這個。但attrs值正在作爲字符串接收。但我需要的數據爲 JSON。不管它是什麼，我需要遍歷爲json或將字符串轉換爲指令端的JSON。我試過angular.toJson()，但它不起作用。如何將grails json數據作爲指令屬性值傳遞給angularjs指令

我的指令：

gateApp.directive('angInputSelect',function(){ 
    return{ 
     restrict : 'E', 
     controller : 'moveTaskRuleDefCtrl', 
     scope : { 
      dirData : '@', 
     }, 
     replace : true, 
     link : function(scope, elem, attrs) { 
      scope.taskCreateForm = attrs.dirData; 
      console.log(scope.taskCreateForm);       
     } 
    } 
});

我的指令模板：

<ang-input:select dir-data="${com.aa.fsight.MoveTaskRuleDef.MoveTaskType.class.getEnumConstants().collect{[name:it.name(), type: it.type]}}" ></ang-input:select>

伏法的Html模板GSP：

<section class="col col-3 required" label-head="Type" dir-name="moveTaskType" dir-id="moveTaskType" dir-class="select2 multiSelect selectElement" dir-model="taskCreateForm.moveTaskType" section-class="col col-3 required" dir-data="[{name=PULL, type=PULL}, {name=SPOT, type=SPOT}, {name=PULL_SPOT, type=PULL SPOT}, {name=DOCKBUMP, type=DOCKBUMP}, {name=YARD_MOVE, type=YARD MOVE}]"><label class="label ng-binding">Type</label><label class="select"><div class="select2-container select2 multiSelect selectElement" id="s2id_moveTaskType" style="width: 100%;"><a href="javascript:void(0)" onclick="return false;" class="select2-choice" tabindex="-1"> <span class="select2-chosen"></span><abbr class="select2-search-choice-close"></abbr> <span class="select2-arrow"><b></b></span></a><input class="select2-focusser select2-offscreen" type="text" id="s2id_autogen15"></div><select ng-model="taskCreateForm.moveTaskType" id="moveTaskType" ng-options="moveTaskType.type as moveTaskType.name for moveTaskType in taskCreateForm" class="select2 multiSelect selectElement select2-offscreen" ng-click="calls()" tabindex="-1"><option value="?" selected="selected"></option></select></label></section>

我得到這個數據，同時在瀏覽器控制檯運行以下命令：

[{name=PULL, type=PULL}, {name=SPOT, type=SPOT}, {name=PULL_SPOT, type=PULL SPOT}, {name=DOCKBUMP, type=DOCKBUMP}, {name=YARD_MOVE, type=YARD MOVE}]

來源

2015-10-01 uday s

嗨，你仍然得到你上面提到的數據作爲字符串？如果是這樣，你有沒有嘗試過使用'angular.fromJson（json）;'？ – Ali

ya。我也嘗試過它..但不工作.. –

我試試這個..angular.fromJson（數據）;和angular.toJson（data）;然後嘗試unlogic var datares = angular.fromJson（data）; var result = angular.toJson（datares）; –

在Groovy/Java中，當你打印一個字符串，你不會看到字符串周圍的雙引號。這是當你將它傳遞給視圖中的元素指令時發生的情況。它不是作爲JSON對象傳遞的，只是因爲格式錯誤的JSON（對於JavaScript）。

要解決這個問題，只需將其解析爲JSON，然後將其傳遞給屬性即可。因此，修改普惠制，如：

<ang-input:select dir-data="${new grails.converters.JSON(com.aa.fsight.MoveTaskRuleDef.MoveTaskType.class.getEnumConstants().collect{[name:it.name(), type: it.type]})}" ></ang-input:select>

我只在new grails.converters.JSON()構造包裹你的價值。此外，修改您的角碼範圍使用=而不是@：

scope : { 
    dirData : '=', 
},

現在嘗試登錄$scope.dirData，你應該得到的對象適當的列表。

來源

2015-10-01 17:03:41

運行此錯誤時出現此錯誤。錯誤：無法在'元素'上執行'setAttribute'：'name'：「pull」，「type」：「pull」}，{「name」：「spot」，「鍵入「：」spot「}，{」name「：」pull_spot「，」type「：」pull「不是有效的屬性名稱。 –

您可以發佈GSP編譯後生成的HTML代碼嗎？ –

我有更新，在上面編輯的代碼..看到在「執行HTML HTML模板：」 –

如何將grails json數據作爲指令屬性值傳遞給angularjs指令

回答

相關問題