Angular-Kendo网格编辑模板-如何访问控制器代码中的这些字段

Question

在我的AngularJS应用程序中，我使用了一个带有编辑模板的剑道网格。这样，当用户单击编辑按钮时，我可以控制模式弹出窗口中的可编辑字段。

现在，在这个编辑模板中，我添加了一些自定义功能；即，一个简单的“添加”选项。这个Add选项将在我的控制器代码中调用一个函数。到目前为止一切都很好。

问题是:当我单击"Add“链接时，我无法通过dataItem.fieldName访问控制器中的字段。

这是我的HTML：

   <div class="col-lg-5">  
            <span id="userKriGrid"
                kendo-grid="settings.userRiskMsrGrid" 
                k-data-source="settings.userRiskMsrGridDS"
                k-options="settings.riskMsrGridOptions" 
                k-rebind="settings.riskMsrGridOptions">
            </span>
   </div>

和我的js控制器中的网格设置：

​

settings.riskMsrGridOptions = {   // Kendo grid settings
	selectable: true,
	columns: [
	  { field: "id", width: "10px", hidden: true },
	  { field: "name", title: "Risk Measure", width: "5px", },                           
	  { field: "kri_group", title: "Cube", width: "20px", hidden: true },
	  { field: "kri", title: "Result Vector", width: "20px", hidden: true},
	  { field: "kri_alias", title: "KRI Name", width: "20px", hidden:true },
	  { field: "aggreg_formula", title: "KRI Expression", width: "35px", hidden: true },
	  { command: [{ name: "edit", text: '' }, { name: "destroy", text: '' }], title: "Edit", width: "5px" }
	],
	editable: {
		mode: "popup",
		template: kendo.template($("#editorTemplate").html())   // loaded up in index.html		
	},
	edit: function (e) {
		var window = e.container.data("kendoWindow");
		window.title("Risk Measure Edit");
	}            
};

​

并且我正在加载一个外部模板(即http://docs.telerik.com/kendo-ui/framework/templates/load-remote )。请注意按钮调用settings.addToDefRiskMsr(e)中的ng-click事件

​

<script id="editorTemplate" type="text/x-kendo-template">
	<form class="form-horizontal">
		<fieldset>				
		<div class="form-group">
			<label class="col-md-4 control-label" for="textinput">Risk Measure</label>  
			<div class="col-md-3">
				<input id="textinput" ng-model="dataItem.name"  class="form-control input-md" type="text" >            
			</div>
            <div class="col-md-2">  <!-- ADD BUTTON HERE !!! -->
                <button type="button" class="btn btn-default" ng-click="settings.addToDefRiskMsr(e)" >
                  <span title="add to Risk Measure grid" class="glyphicon glyphicon-arrow-right" aria-hidden="true"></span> Add to DRM
                </button>                
            </div>
		</div>

	

		</fieldset>
	</form>
</script>

​

同样，上面的模板代码使用dataItem.fieldName将我想要的字段拉到用户具有编辑权限的位置。

现在我如何在我的控制器中访问这个字段呢？dataItem.name不能工作！

    settings.addToDefRiskMsr = function (e) {
        var riskMeasureName = dataItem.name;    // NOT WORKING !!!

非常感谢您的建议。

致以问候，鲍勃}

Answer 1

如果你正在使用原始的基于jQuery的Kendo UI (也就是不是从头开始为Angular 2制作的新版本)和Angular 1.5+，并且你正在使用controllerAs方法，你可能会发现dataItem字段在你的控制器中并不总是可访问的。在我的例子中，我有一个带有ng-show属性的编辑模板，它调用一个控制器方法，传递一个dataItem字段，我注意到dataItem有时在控制器中是未定义的。因此，我的解决方案是在控制器中注入$scope，然后可以作为$scope.$parent.dataItem访问dataItem。

哦，这是Kendo UI中的一个bug。