Question

angular.module('InvoicerApp')
    .directive('invoice', function() {
        return {
            restrict: 'E',
            templateUrl: 'templates/invoice-directive.html',
            scope: true
        };
    });

发票directive.html

        <div class="row">
            <div class="col-md-1">
                <input type="text" ng-model="invoice.product.tax" class="form-control input-sm" placeholder="TVA">
            </div>
            <div class="col-md-1">
                <select type="text" ng-model="invoice.product.includeTax" class="form-control input-sm" placeholder="TVA?">
                    <option value="true" selected>Include TVA</option>
                    <option value="false">Nu include TVA</option>
                </select>
            </div>
            <div class="col-md-1">
                <button type="text" ng-model="invoice.product.add" class="btn btn-primary btn-sm" ng-click="invoiceAddProduct()">
                    <span class="glyphicon glyphicon-plus"></span>
                </button>
            </div>
        </div>

控制器

$scope.invoice = {};
    $scope.invoice.products = [];
    $scope.client = {};


    $scope.invoiceAddProduct = function() {
        console.log("HELLO");    
    };

invoiceAddProduct未从指令模板内部触发。如何从控制器中的指令模板内部访问模型？

Answer 1

看起来您的指令的范围不属于您的控制器范围。请检查您的HTML。看看我从一个指令调用控制器函数的小提琴：

演示：jsfiddle.net/X7Fjm/2/

来自指令模板AngularJS的事件

1 个答案: