Angular UI Grid - style das Spaltenmenü/wende eine Vorlage an

Question

Ich möchte das angularjs ui-grid verwenden und habe eine Bedingung: Es muss möglich sein, ein Spaltenfiltermenü zu stylen.

In der documentation wird nur erläutert, wie Sie neue Elemente zu einem Spaltenmenü hinzufügen, aber nicht, wie Sie das Design ändern oder andere Steuerelemente hinzufügen. Wenn wir the example betrachten, sollte es zum Beispiel möglich sein, ein Spaltenmenü zu öffnen, das zwei benutzerdefinierte formatierte Radioknöpfe (männlich, weiblich) mit zwei Knöpfen anzeigen kann, zwei akzeptieren oder die Änderungen ablehnen. Wenn die Änderungen akzeptiert werden, sollte der Filter angewendet werden.

Ist es irgendwie möglich, Vorlagen für das Spaltenmenü zu verwenden, wie es für die columns header möglich ist? Wie erstelle ich ein benutzerdefiniertes Spaltenmenü?

Vielen Dank.

Answer 1

Siehe plunker für die Lösung.

Innerhalb Ihrer columnDefs müssen Sie nur menuItems hinzufügen. Ich hatte Schwierigkeiten, aus Ihrer Frage zu verstehen, was genau Sie mit diesen zusätzlichen Dropdown-Optionen wollten. Ich habe das allgemeine Format für Sie in einem sehr einfachen Beispiel modelliert, wobei die erste benutzerdefinierte Option nur in Ihrem Menü angezeigt wird und die zweite eine Warnung aktiviert enthält den Spaltennamen. Bitte lassen Sie mich wissen, wenn dies (nicht) ausreichend ist. Eine vollständige Liste der unterstützten Attribute für Menüeinträge finden Sie unter this tutorial.

columnDefs: [ 
    { 
    field: 'name', 
    menuItems: [{ 
     title: 'Custom Nothing' 
    }, { 
     title: 'Column Name', 
     action: function() { 
     alert(this.context.col.displayName); 
     } 

    }] 
    } 

] 

Answer 2

über Came, was ich denke OP suchte, auf jeden Fall, was ich suchte, über http://ui-grid.info/docs/#/api/ui.grid.class:GridOptions.columnDef#properties_headercellfilter

Es ist ärgerlich Sie nur die Drop-Down-Vorlage zu ändern, nicht in der Lage sein scheinen, müssen Sie Überschreiben Sie die gesamte Header-Zellenvorlage, aber zumindest können Sie dies auf einer individuellen Basis tun.