Question

我正在创建一个包含传递特定属性的组件的指令。到目前为止，我有以下内容。请注意，它需要有权访问父作用域才能正常工作。问题是isOpen变量然后被放置在父作用域上。因此，相同范围内的两个日期选择器（例如开始日期和结束日期）不能独立触发。

app.directive('mzDatePicker', [
'underscore',
(_) => {
'use strict'
const dasherize = name =>
  name.replace(/[A-Z]/g, (letter, pos) => (pos ? '-' : '') + letter.toLowerCase());

return {
    restrict: 'E',
    template: (el, attr) => {
        //Note ng-required won't work with the same strategy as other attributes
        return `
            <input uib-datepicker-popup
                is-open="isOpen"
                show-weeks="false"
                show-button-bar="false"
                ng-required="${'undefined' == typeof attr.ngRequired ? '' : 'true'}" 
                ${
                    _.chain(attr)
                        .pick('ngModel', 'ngModelOptions', 'placeholder', 'class', 'maxDate', 'minDate', 'dateDisabled')
                        .pairs()
                        .map(x => `${dasherize(x[0])}="${x[1]}"`)
                        .value()
                        .join(' ')
                }
                />
            <button type="button" ng-click="isOpen = !isOpen">
                <i class="fa fa-calendar"></i>
            </button>
        `
    }
} }])

我可以将指令isolate 只是范围中的isOpen变量吗？

Answer 1

啊，原来我想要一个儿童范围。设置

scope: true

效果很好。

角度指令反向隔离范围

1 个答案: