Voici mon exemple de plumker: strong> http://plnkr.co/edit/tc9frhaeoqloqy7sk1ae? p = aperçu Qu'est-ce que j'essaie de faire: strong>
Louchez la case à cocher HTML à partir de Field04 dans mes données sur la cellule à l'aide de CellTemplate et avez toujours accès à sa fonction NG-clic. P> code dans l'application.js: p> <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>
3 Réponses :
Je ne suis pas sûr que je comprends votre code.
Vous ne devez pas mettre de code HTML dans vos données. Donc, je l'ai changé à: p> Suivant: Dans votre modèle de cellule, transmettez une référence à la valeur qui change: p> Notez que la fonction dans la portée externe, vous devez réagir au paramètre: p> < Pré> xxx pré> (Vous n'avez pas vraiment besoin the En outre, j'ai ajouté une aide de débogage sur votre HTML pour vous montrer que les travaux de liaison sont plutôt bien: P> < Pré> xxx pré> voici un PLUCKER . Est-ce ce que vous voulez? P> Voici une autre PLUCKER qui présente la case à cocher dans la colonne 4. p> p> showme () code> a maintenant un paramètre: p>
PileProp code>) p>
$ pérature.toggle () code> fonction peut être Supprimé, ou peut être appelé à partir de
showme () code>. p>
Mettre HTML dans les données est quelque chose que je fais du côté du client. Lorsque les données sont entrées dans I, je vérifie chaque article des propriétés "autorisations". Par exemple, si "autorisations" a "CANEDIT: vrai", "HASDOCUMUMUMENT: TRUE" Je dois afficher ces icônes correspondantes dans une seule cellule. L'icône du document doit avoir un lien qui lui est associé au fichier actuel. Dans JQGRID, j'ai résolu ceci en utilisant une fonction "AfterSerRowow". Mais dans UI-Grid, je ne sais pas comment faire la même chose. Devrais-je poster une nouvelle question à ce sujet? Si je l'ai fait correctement, je n'aurais pas un problème de Cochez la casque de coche?
Voici un PLUCKER avec Appscope, externe-Scopes ne fonctionne plus.
J'ai apporté des modifications à travailler avec de nouvelles Appscope: p> dans la portée, vous devez réagir au paramètre mais j'ai tiré de MyViewModel et je viens de créer un Fonction Inside intérieure: P> $scope.showMe : function(value){
alert('toggled to: '+value);
};
Veuillez inclure les bits de code correspondants dans votre réponse.
Je n'ai jamais publié ici. Il a fait du temps pour comprendre pourquoi mon code n'allait pas à la réponse.
La sortie de Plunkr est cassée. Ne peut pas voir la table.
Vous devez utiliser $ SCE pour dire NG-BIND-HTML que le contenu HTML que vous attachez est sûr.
J'ai fourbé votre plumker et la solution à votre question est http://plnkr.co/edit/jytaf8nijlf9wpb775kb?p=preview p>
app.filter('unsafe', function ($sce) { return $sce.trustAsHtml; });
Y a-t-il une raison pour laquelle vous ne pouvez pas mettre votre HTML HTML désiré dans un chariot cellulaire dans les colonnes? Est-ce parce que le HTML que vous voulez appartenir à vos données? La façon dont vous avez atteinte pour le champ03 serait la bonne façon de le faire. Lorsque vous travaillez avec UI-Grid (qui est NG-Grid 3.0), vous souhaitez mettre votre HTML personnalisé dans une cellule de cellt.
Lorsque les données sont entrées dans, je dois le filtrer en quelque sorte. Par exemple, Field03 est "Autorisations", si "Autorisations": "CANEDIT" est vrai, j'ai besoin d'afficher une icône d'édition. En outre, l'élément de ligne peut avoir un document lié à celui-ci, dans l'affirmative, j'ai donc besoin d'afficher une icône de lien de document juste à côté de l'icône "Canedit" dans le champ 03. Dans "UI-Grid", je ne peux pas comprendre comment exécuter des scripts comme celui-ci, car les données sont chargées dans la grille. Je pourrais le faire dans JQgrid en utilisant AftraSerRow: fonction (Rowid, données) {}
Vous pouvez créer un filtre personnalisé en angulaire pour gérer cette logique. Vous pouvez ensuite appeler ce filtre pour cette colonne comme suit:
{nom: 'Field04', champ: 'Field04', Cellfilter: 'myNewfilter'} code>
J'ai essayé d'abord l'itinéraire Cellfilter, mais cela ne gère pas HTML. Tout ce qui est retourné du filtre est lu comme "texte seulement", alors mon HTML est imprimé dans la cellule. Cellfilter ne fonctionne également pas si vous utilisez CellTemplate.
Si vous utilisez un téléphone cellulaire, vous pouvez ajouter le filtre comme celui-ci:
CellTemplate: ' {{col_field | myfilter}} span> ' code>. De plus, vous pouvez retourner HTML à l'aide d'un filtre. Injectez le service $ SCE dans le filtre et faites-le renvoyer le filtre ceci:
retour $ sce.trustashTML (" Stuff HTML personnalisé SPAN>"); CODE>
Le filtre provoque une cumulation infiniment "RéférenceErthError: $ SCE n'est pas définie". Je référencis $ SCE dans mon contrôleur de grille, suis-je censé y référoir ailleurs pour que le filtre fonctionne?
Vous devez injecter le service $ SCE dans le nouveau filtre, non dans votre contrôleur. Par exemple.
app.filter ('myNewfilter', fonction ($ sce) {... code>
Injecter le service $ SCE dans le nouveau filtre s'est débarrassé de l'erreur, mais le filtre imprime toujours le balisage HTML dans la cellule sous forme de texte. Je vais relier un exemple de plumrer séparé pour ce problème quand je peux.
Désolé pour le retard. Si vous pouvez produire une plunkr, je suis heureux de vous promener. Le service $ SCE devrait vous permettre de retourner HTML à votre vue.