Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/397.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Angular JS click事件在wijgrid colum中不起作用_Javascript_Angularjs_Wijmo_Wijgrid - Fatal编程技术网

Javascript Angular JS click事件在wijgrid colum中不起作用

Javascript Angular JS click事件在wijgrid colum中不起作用,javascript,angularjs,wijmo,wijgrid,Javascript,Angularjs,Wijmo,Wijgrid,我在angular js中使用wijgrid组件,我遇到了无法对其执行单击事件的问题。在wijgrid html组件未编译的情况下,查找html代码 <wij-grid id = "dataGrid" allow-sorting="true" data="data" columns-autogeneration-mode="none" allow-paging="true" > <columns> <column data-key="name" he

我在angular js中使用wijgrid组件,我遇到了无法对其执行单击事件的问题。在wijgrid html组件未编译的情况下,查找html代码

<wij-grid  id = "dataGrid" allow-sorting="true" data="data" columns-autogeneration-mode="none" allow-paging="true" >
  <columns>
     <column data-key="name" header-text="Name"></column>
     <column data-key="address" header-text="Address" ></column>
     <column data-key="submit" header-text="Submit"></column>
   </columns>
</wij-grid>     

还有我的js代码

$http.get(url,data).success(
        loadData);  

function loadData(responseData) {
if (responseData != null) {
    var data = responseData;
    for (index = 0; index < data.length; index++) {
        data[index].address =   data[index].addressLineOne+","+data[index].addressLineTwo;                                  
        $SubmitBtn  = "<a href='javascript:void(0);ng-click='submitCode("+data[index].reviewId+",true)'>Approve</a>";   data[index].submit=$ASubmitBtn;                                     
    }
    $scope.data = data;
    $("#content").wijtabs();
  }
}    
$scope.submitCode= function(id, status) {
alert(id+" "+status)
} 
$http.get(url,数据)。成功(
装载数据);
函数加载数据(响应数据){
if(responseData!=null){
var数据=响应数据;
对于(索引=0;索引

此处提交代码函数未调用,在源代码视图中,函数显示id和状态。。这意味着它不是在wijgrid模块中编译的,请帮助我提供解决方案。我试图编译代码$compile($sumitBtn)($scope),但它不起作用,请建议我解决这个问题,Wijmo知道这个问题,并说这是一个已知的bug。我使用的解决方法是:

  $scope.cellStyleFormatter = function(args) {
  if ((args.row.type & wijmo.grid.rowType.data) && (args.row.state & wijmo.grid.renderState.rendering)) {
        var content = args.$cell[0].innerHTML;
        //Here I have button html already in my grid data, using 
        //'my-link-class' css
        if(content.indexOf("my-link-class") > -1) {
            var scope = angular.element("#grid-container").scope();
            args.$cell
                .empty()
                .append($(content).click(function () {
                    scope.myControllerClickHandler();
                })
            );
        }
        return true;
    }
    };
我声明我的网格如下:

    <wij-grid  data="template.model.content" allow-editing="false" cellStyleFormatter="cellStyleFormatter">
      <columns>
        <column dataKey="col_0" ></column>
      </columns>
    </wij-grid>

我使用上面的cellStyleFormatter是因为我可以将其全局应用于整个网格。如果您提前知道该列,您可以使用cellFormatter(我的应用程序具有可变的列数,因此这不是我的选项)。如果使用cellFormatter,您将引用args.container而不是args.$cell


以下是wijmo解释的链接:

wijmo知道这个问题,并说这是一个已知的bug。我使用的解决方法是:

  $scope.cellStyleFormatter = function(args) {
  if ((args.row.type & wijmo.grid.rowType.data) && (args.row.state & wijmo.grid.renderState.rendering)) {
        var content = args.$cell[0].innerHTML;
        //Here I have button html already in my grid data, using 
        //'my-link-class' css
        if(content.indexOf("my-link-class") > -1) {
            var scope = angular.element("#grid-container").scope();
            args.$cell
                .empty()
                .append($(content).click(function () {
                    scope.myControllerClickHandler();
                })
            );
        }
        return true;
    }
    };
我声明我的网格如下:

    <wij-grid  data="template.model.content" allow-editing="false" cellStyleFormatter="cellStyleFormatter">
      <columns>
        <column dataKey="col_0" ></column>
      </columns>
    </wij-grid>

我使用上面的cellStyleFormatter是因为我可以将其全局应用于整个网格。如果您提前知道该列,您可以使用cellFormatter(我的应用程序具有可变的列数,因此这不是我的选项)。如果使用cellFormatter,您将引用args.container而不是args.$cell


下面是wijmo解释的链接:

我使用cellformatter方法得到了解决方案,在那里我根据自己的要求更改了代码

$scope.formatter = function(args) {
if(args.row.dataRowIndex < 0 ) 
return false;
args.$container
.html($compile(
args.formattedValue)
($scope));
return true;    
}   
$scope.formatter=函数(args){
如果(args.row.dataRowIndex<0)
返回false;
args.$container
.html($compile)(
args.formattedValue)
($scope));
返回true;
}   

我使用cellformatter方法得到了解决方案,我根据自己的要求更改了代码

$scope.formatter = function(args) {
if(args.row.dataRowIndex < 0 ) 
return false;
args.$container
.html($compile(
args.formattedValue)
($scope));
return true;    
}   
$scope.formatter=函数(args){
如果(args.row.dataRowIndex<0)
返回false;
args.$container
.html($compile)(
args.formattedValue)
($scope));
返回true;
}   

Hi Edwards,感谢您的回复,我之前尝试过这个仅适用于静态数据的示例。。但在本例中,我动态地获取数据,并使用reviewId的调用事件函数。在这种情况下,我无法使用CellFormatter和cellStyleFormatter,请建议我使用其他方法。你的意思是在运行时更改数据?我的数据也来自远程服务,但每次更新都会更新$location.path,这会导致控制器重新加载和实例化网格,这与销毁和重新创建wij网格相同。另外,如果你的项目放弃wijmo还不算太晚,那可能是最好的办法。嗨,Edwards,谢谢你的回复,我之前试过这个例子,它只适用于静态数据。。但在本例中,我动态地获取数据,并使用reviewId的调用事件函数。在这种情况下,我无法使用CellFormatter和cellStyleFormatter,请建议我使用其他方法。你的意思是在运行时更改数据?我的数据也来自远程服务,但每次更新都会更新$location.path,这会导致控制器重新加载和实例化网格,这与销毁和重新创建wij网格相同。此外,如果您的项目放弃wijmo还不算太晚,那么这可能是最好的选择。