Angular指令 - 与多个子输入元素共享ng模型

Question

我有一个包含2个输入元素的angular指令。我想将一个对象传递给ng-model并让两个输入更新对象的属性。我怎么能完成这个？

<compound-input ng-model="$ctrl.item"></compound input>

这将加载到以下模板中：

<div layout="row" flex>
    <md-input-container flex>
        <label>Value</label>
        <input required name="name" ng-model="$ctrl.item.value" type="text" />
    </md-input-container>
    <md-input-container flex ng-show="$ctrl.value">
        <label>Label</label>
        <input required name="name" ng-model="$ctrl.item.label" type="text" />
    </md-input-container>
    <div class="action-icons"></div>
</div>


import angular from 'angular';
require( "./html/CompoundInput.html");

class CompoundInputController {
  constructor($parse, $attrs, $scope) {
    'ngInject';

    this.$parse = $parse;
    this.$attrs = $attrs;
    this.$scope = $scope;    

    this.errors = [];
   }
}

class CompoundInput {
    constructor ($ngModel) {
        'ngInject';

        this.restrict = 'E';
        this.templateUrl = 'CompoundInput.html';
        this.require = '?ngModel';
        this.controller = "CompoundInputController as $ctrl";
        this.scope = { ngModel: '=' };
    }


    link($scope, $element, $attrs, $ctrl) { 

    }

    // Create an instance so that we can access this inside link
    static factory() {
        CompoundInput.instance = new CompoundInput();
        return CompoundInput.instance;
    }
}

angular
    .module('doxa.directives.CompoundInput', [])
    .controller('CompoundInputController', CompoundInputController )
    .directive('CompoundInput', CompoundInput.factory )
    .name;