zoukankan      html  css  js  c++  java
  • [AngularJS + Webpack] Requiring Templates

    With Angular, most of the time you're specifying a templateUrl for your directives and states/routes. This means you need to make sure that you're loading in these templates into the $templateCache for your tests and production. Oh, and don't forget to update all your URLs whenever you move the files around! When you add in Webpack and the html-loader, you don't need to do this anymore. Simply require the html file and your work is done!

    Install:

    npm install -D html-loader

    webpack.config.js:

    module.exports = {
        entry: {
            app: ['./app/index.js']
        },
        output: {
            path: './build',
            filename: 'bundle.js'
        },
        module: {
            loaders: [
                {test: /.js$/, loader: 'babel-loader', exclude: /node_modules/},
                {test: /.html$/, loader: 'html-loader', exclude: /node_modules/}
            ]
        }
    };

    hello.js:

    export default (ngModule) => {
        ngModule.directive('hello',  () => {
            return {
                restrict: 'E',
                scope: {},
                template: require('./hello.html'),
                controllerAs: 'vm',
                controller: function() {
                    var vm = this;
                    vm.greeting = "Hello";
                }
            }
        })
    }
  • 相关阅读:
    W3C help
    css值解析
    css中的格式上下文Formatting Context
    css中绝对定位中的left和top属性
    事件模型
    程序员应该如何更有效率
    css的边偏移距离
    css插入框
    css中的whitespace属性
    源码安装nginx 方法二
  • 原文地址:https://www.cnblogs.com/Answer1215/p/4792446.html
Copyright © 2011-2022 走看看