Name-Array mit ng-Modell

Question

Ich habe eine Schaltfläche zum Hinzufügen, die eine Direktive verwendet, um dem tbody einer Tabelle (.estimates) hinzuzufügen:

function EstimateCtrl( $scope, $compile ) {

    $scope.services = [
            { 'value': 'c', 'name': 'Standard-Kurier' },
            { 'value': 'xc', 'name': 'Express-Kurier' },
            { 'value': 'cc', 'name': 'Landkurier' }
    ]

    $scope.add = function() {

        angular.element('.estimates tbody').append( $compile('')($scope) );

    }

}

angular.module('dashboard', [])
    .directive('estimate', function() {

        return {

            restrict: 'A',
            template: '$0.00x',
            link: function( scope, element, attrs ) {

                element.find('.remove').bind('click', function() {

                    element.closest('tr').remove();

                });

            }

        }

    });

Wie kann ich ein Element-Array mit ng-model in AngularJS haben? Zum Beispiel:

zu

Ich habe einen Tag und eine Hälfte recherchiert, aber ich komme einfach nicht weiter. Ich hoffte, dass vielleicht jemand mich in die richtige Richtung lenken könnte. Vielen Dank für jede Hilfe.

---

Bearbeiten: Hier ist der Link zum Plunker. Ich bin sicher, nachdem Sie diesen gesehen haben, wissen alle, worum es geht: http://plnkr.co/edit/JlYB9P0vyAqghOmeNYh4

---

Bearbeiten2: Mal sehen, ob ich euch allen mit einem weiteren Beispiel zeigen kann, was ich meine

    Foo
    Bar

    Foo
    Bar

    Foo
    Bar

Ausgabe

Answer 1

Okay! Ich habe einen Workaround gefunden.

Ich habe die Direktiven aufgegeben und es auf eine andere Weise gemacht, hier ist mein funktionierender Code:

HTML:

                0,00 €
                x

JavaScript:

function Ctrl( $scope, $compile ) {

    $scope.estimate.services = [
        { name: 'service1', value: '' }
    ];

    $scope.options = [
        { name: 'Option 1', value: 'opt1' },
        { name: 'Option 2', value: 'opt2' },
        { name: 'Option 3', value: 'opt3' }
    ];

    $scope.add = function() {

        $scope.estimate.services.push({
            name: 'service' + ($scope.estimate.services.length + 1),
            value: ''
        });

    };

}

Answer 2

BEARBEITET:

OK, sagen wir, Sie haben zwei Arrays von konfigurierbaren Optionen:

options1=[...]
options2=[...]

Wenn ich es richtig verstehe, möchten Sie also ein Auswahlfeld, mit dem Sie einen Satz von ihnen auswählen können, richtig? Zuerst müssen Sie also beide in einem anderen Array umschließen oder wie schon zuvor erwähnt in einem anderen Objekt.

Verwenden wir also ein Objekt (ich kann auch ein Array-Beispiel angeben)

var $scope.myOptions = { 'LabelForOptions1' : options1, 'LabelForOptions2' : options2 }

Dann benötigen wir einen Ort, um die ausgewählten Optionen zu speichern

 $scope.selectedOptions = {};

und schließlich das Auswahlfeld selbst

Bemerken Sie, dass die Variablen options1 und options2 auch einen einzelnen Wert sein könnten und das Beispiel trotzdem funktionieren würde

VOLLSTÄNDIGE LÖSUNG FÜR DAS PROBLEM: Ich nehme an, dies ist Ihr Modell:

function MyController($scope) {
    $scope.options1 = ['Foo1','Bar1'];
    $scope.options2 = ['Foo2','Bar2'];
    $scope.options3 = ['Foo3','Bar3'];
    $scope.allOptions = [$scope.options1, $scope.options2, $scope.options3];
    $scope.selectedOptions = ["none","none","none"];
};

Das wäre also die Lösung:

Arbeitsbeispiel: http://jsfiddle.net/qGRQF/11/