NG-CLICK 이벤트를 NG-GRID에 삽입하십시오

StackOverflow https://stackoverflow.com//questions/22073714

문제

가능한지 알지 못하는

를 알고 싶습니다.

html 

<!DOCTYPE html>
    <html ng-app="myApp">
    <head lang="en">
        <meta charset="utf-8">
        <title>Custom Plunker</title>  
        <link rel="stylesheet" type="text/css" href="http://angular-ui.github.com/ng-grid/css/ng-grid.css" />
        <link rel="stylesheet" type="text/css" href="style.css" />
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js"></script>
        <script type="text/javascript" src="http://angular-ui.github.com/ng-grid/lib/ng-grid.debug.js"></script>
        <script type="text/javascript" src="main.js"></script>
    </head>
    <body ng-controller="MyCtrl">
        <div class="gridStyle" ng-grid="gridOptions"></div>
    </body>
 </html>
.

js 

// main.js
var app = angular.module('myApp', ['ngGrid']);
app.controller('MyCtrl', function($scope) {
    $scope.myData = [{name: "Moroni", age: 50},
                     {name: "Tiancum", age: 43},
                     {name: "Jacob", age: 27},
                     {name: "Nephi", age: 29},
                     {name: "Enos", age: 34}];
    $scope.gridOptions = { data: 'myData',
                         cellTemplate:'<div class="ngCellText" ><a ng-click="foo()">{{row.getProperty(col.field)}}</a></div>' 
    }
    $scope.foo = function() {  

        alert('');
    };
});
.

NG 그리드의 연속에 NG 클릭 이벤트를 넣으려고하고 싶습니다. 주변을 둘러 보는 아이디어를 가져 왔지만, 가능하면 실제로 이해하지 못하고 그렇게하는 경우 그렇습니다.그렇게 할 올바른 방법. 이 코드에서는 나에게 좋은 것처럼 보입니다. 앱은 경고를 시작하지 않습니다, 어떤 제안이나 아이디어가 있습니까?

여기는 plunker http://plnkr.co/edit/u6wdwtav30hrhjk8xfpa?p=preview

도움이 되었습니까?

해결책

이러한 정의는 나를 위해 작동합니다 : 

  $scope.gridOptions = {
    data: 'myData',
    columnDefs: [{
        field: 'name',
        displayName: 'Name',
        cellTemplate: '<div  ng-click="foo()" ng-bind="row.getProperty(col.field)"></div>'
      }, {
        field: 'age',
        displayName: 'Age',
        cellTemplate: '<div  ng-click="foo()" ng-bind="row.getProperty(col.field)"></div>'
      }

    ]
  };
.

당신의 포크를 참조하십시오 여기

다른 팁

GitHub 사이트의 문서는 실제로 오래되었습니다.

여기 에이 문제에 대한 올바른 페이지에 대한 링크가 있습니다. http://ui-grid.info/docs/#/tutorial/305_appscope 

        yourCtrl.gridOptions = {
            enableFiltering: true,
            enableHiding : false,
            enableSorting: true,
            appScopeProvider : yourCtrl,
            rowTemplate: '<div ng-click="grid.appScope.doSomething(row)" ng-repeat="(colRenderIndex, col) in colContainer.renderedColumns track by col.uid" class="ui-grid-cell" ng-class="col.colIndex()" ui-grid-cell></div>',
        };

        yourCtrl.doSomething = function(row) {
            alert("lala");
        }
.

예, 어떻게 든 

ng-click="grid.appScope.doSomething"
.

는 작동하지 않습니다 

$scope.ShowDetails=function(_obj)
{
   alert('Hi! ' + _obj);
}

$scope.gridOptions = {
    columnDefs: [
      { name: 'Search', field: 'Col1', cellTemplate: '<div ng-click="grid.appScope.ShowDetails(row)"><img src="/images/search.png" /></div>' },
      { name: 'Col2', displayName: 'Col2' },
    ]};
.

여기서 이벤트를 UI 그리드 셀에 연결하십시오.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top