ist mein Plunker Beispiel:http://plnkr.co/edit/Tc9FRHAEoQlOqy7sk1Ae?p=previewWarum kann ich das Eingabefeld "checkbox" in cellTemplate nicht binden? Hier
Was ich versuche zu tun: Binden Sie das Kontrollkästchen HTML vom field04 in meine Daten in die Zelle Celltemplate verwendet und haben weiterhin Zugriff auf ihre ng-Klick-Funktion .
-Code in app.js:
var app = angular.module('app', ['ui.grid', 'ngSanitize']);
app.controller('MainCtrl', ['$scope', '$log', function ($scope, $log, $sce) {
$scope.myViewModel = {
someProp:'abc',
showMe : function(){
alert(this.someProp);
}
};
$scope.gridOptions = {
};
$scope.gridOptions.columnDefs = [
{ name: 'field01', field: 'field01' },
{ name: 'field02', field: 'field02'},
{ name: 'field03', field: 'field03', cellTemplate: '<input type="checkbox" ng-model="row.entity.field03" ng-click="$event.stopPropagation();getExternalScopes().showMe()">'},
{ name: 'field04', field: 'field04', cellTemplate: 'viewTemplate2'},
{ name: 'field05', field: 'field05', cellTemplate: 'viewTemplate2'}
];
$scope.gridOptions.data = [
{
"field01": "one",
"field02": "01",
"field03": false,
"field04": '',
"field05": '',
},
{
"field01": "two",
"field02": "02",
"field03": false,
"field04": '',
"field05": '',
},
{
"field01": "three",
"field02": "03",
"field03": false,
"field04": '<input type="checkbox" ng-model="row.entity.field03" ng-click="$event.stopPropagation();getExternalScopes().showMe()">',
"field05": '<div><a href="#" title="icon link"><img class="icon" alt=""/></a></div>',
}
];
$scope.toggle = function() {
alert("toggled");
}
}]);
-Code von index.html:
<body>
<div ng-controller="MainCtrl">
<div ui-grid="gridOptions" external-scopes="myViewModel" class="grid"></div>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular-sanitize.min.js"></script>
<script src="app.js"></script>
<script type="text/ng-template" id="viewTemplate2">
<span ng-bind-html="row.entity[col.field]"></span>
</script>
</body>
ich die richtige Wirkung in field03 bin zu erreichen, wenn ich die html im columnDef schreiben. Danke an TomMorgans Plünderer hier: http://plnkr.co/edit/9eRg9Yjl2ooeSuWMJ8x2?p=preview.
Ich kann das cellTemplate mit html aus den Daten in field05 füllen.
Warum funktioniert es nicht für meine Checkbox in field04?
Ich bin neu bei angularjs und es ist schwierig zu trennen "Ui-Grid" -Lösungen von "ng-Grid" -Lösungen. Ich schätze die Hilfe.
Gibt es einen Grund, warum Sie Ihre gewünschte setzen können nicht verwendet werden HTML in einem cellTemplate innerhalb der columnDefs? Liegt es daran, dass der von Ihnen gewünschte HTML-Code als Ihre Daten eingeht? Die Art und Weise, wie Sie es für field03 erreicht haben, wäre die richtige Vorgehensweise. Wenn Sie mit ui-grid arbeiten (das ist ng-grid 3.0), möchten Sie Ihren eigenen HTML-Code in ein cellTemplate einfügen. – nairys
Wenn die Daten eintreffen, muss ich sie irgendwie filtern. Zum Beispiel ist field03 "Berechtigungen", wenn "Berechtigungen": "canEdit" ist wahr Ich muss ein Bearbeitungssymbol anzeigen. Das Zeilenelement kann auch mit einem Dokument verknüpft sein, wenn dies der Fall ist, muss ich ein Dokumentverknüpfungssymbol direkt neben dem "canEdit" -Symbol in Feld03 anzeigen. In "UI-Grid" kann ich nicht herausfinden, wie man solche Skripte ausführt, wenn die Daten in das Grid geladen werden. Ich könnte es in jqgrid mit AfterInsertRow: Funktion (Rowid, Daten) {} – amadis77
Sie können einen benutzerdefinierten Filter in eckigen, um diese Logik zu behandeln. Sie können dann den Filter für diese Spalte wie folgt aufrufen: '{name: 'field04', field: 'field04', cellFilter: 'myNewFilter'}' – nairys