javascript - Angular 1.5(组件): how to use directives with es6?

Question

在文件夹 directives 中我创建了两个文件:directives.js 和 color.js

指令 我已经导入到 app.js 中

directives.js:

import angular from 'angular';

import ColorDirective from './color';

const moduleName = 'app.directives';

angular.module(moduleName, [])

  .directive('color', ColorDirective);

export default moduleName;

color.js

import angular from 'angular';


let ColorDirective = function () {

  return {
    link: function (scope, element) {
      console.log('ColorDirective');
    }
  }

}

export default ColorDirective;

在组件中的一个元素上，我添加了 color 作为 attr。

但它不起作用。我的意思是内部链接循环。为什么？我有什么错误的编码？如何在 angular 1.5 和 es2016 中使用指令？

Answer 1

从您所写的内容来看，不可能看出问题所在。您提供的代码有效，前提是您已将模块包含到页面中并且代码已正确编译。

我已将您的代码放入 fiddle 中，https://jsfiddle.net/fccmxchx/

let ColorDirective = function () {
  return {
    link: function (scope, element) {
      console.log('ColorDirective');
      element.text('ColorDirective');
    }
  }
}

angular.module('app.directives', [])
  .directive('color', ColorDirective);

不幸的是我不能将你的代码拆分成模块，但这正是你的代码试图做的