如何使用NPM模块的角度？ [英] How to use npm module in angular?

问题描述

我试图用<一个href=\"http://app.controller('BillingController',%20['$scope%E2%80%99,%20%E2%80%98braintree-web%E2%80%99,%20function($scope,%20braintree-web)%7B\"相对=nofollow>布伦特里的Web NPM模块AngularJS，因为我得到的错误，当我试着和它包括在模板中：

I am trying to use braintree-web npm module with AngularJS since I get errors when I try and include it in the template with:

<script src="https://js.braintreegateway.com/v2/braintree.js"></script>

我有一个状态调用计费，我使用路由到我的模板与控制器，'BillingController。我希望能够注入布伦特里的Web和myscript.js：

I have a state called billing that I use to route to my template with the controller, 'BillingController'. I want to be able to inject braintree-web and myscript.js:

<script>
  braintree.setup(
          // Replace this with a client token from your server
          clientToken,
          "dropin", {
            container: "payment-form",
            form: "checkout",
          });
</script>

请帮忙。我该怎么做呢？

Please help. how can I do this?

修改

目前，这被放置在底部我

Currently, this is placed a the bottom of my

<!-- braintree sdk -->
    <script src="https://js.braintreegateway.com/v2/braintree.js"></script>

    <!-- braintree setup -->
    <script>
      var clientToken = removed;
      braintree.setup(
          // Replace this with a client token from your server
          clientToken,
          "dropin", {
            container: "payment-form",
            form: "checkout",
          });
    </script>

这是我收到的错误：

These are the errors I'm getting:

像布伦特里脚本没有加载在我看来（？）

Looks to me like the braintree script is not loading(?)

感谢您的帮助。

推荐答案

您是否使用布伦特里的Web 此网址是什么？ https://github.com/jeffcarp/braintree-angular

Do you use braintree-web from this url? https://github.com/jeffcarp/braintree-angular

这是模块的特殊角度。那么你应该创建一个像 app.js 文件并粘贴此code：

This is module special for angular. Then you should create file like app.js and paste this code:

var yourApp = angular
  .module('yourApp', ['braintree-angular'])
  .constant('clientTokenPath', '/path-or-url-to-your-client-token');

例如：

(function () {
    'use strict';

    var app = angular.module('yourModuleName', [
        'braintree-angular'
    ]);

    app.constant('clientTokenPath', '/path-or-url-to-your-client-token');

    app.config(['$interpolateProvider', function ($interpolateProvider) {
        $interpolateProvider.startSymbol('[[');
        $interpolateProvider.endSymbol(']]');
    }]);


}());

您controller.js可能是这样的：

Your controller.js could be like this:

(function() {
    'use strict';

    angular
            .module('yourModuleName')
            .controller('DashboardCtrl', DashboardCtrl);

    DashboardCtrl.$inject = ['$scope', '$braintree'];

    function DashboardCtrl($scope, $braintree) {

        var client;
        $scope.creditCard = {
            number: '',
            expirationDate: ''
        };

        var startup = function() {
            $braintree.getClientToken().success(function(token) {
                client = new $braintree.api.Client({
                    clientToken: token
                });
            });
        };

        $scope.payButtonClicked = function() {

            // - Validate $scope.creditCard
            // - Make sure client is ready to use

            client.tokenizeCard({
                number: $scope.creditCard.number,
                expirationDate: $scope.creditCard.expirationDate
            }, function (err, nonce) {

                // - Send nonce to your server (e.g. to make a transaction)

            });
        };

        startup();

    }


}());

注意 app.js 应该包含你的控制器，工厂和服务，休息之前，你angular.js和braintree.js库后。

Notice that app.js should be included before rest of your controllers, factories and services, and after you angular.js and braintree.js library.

这篇关于如何使用NPM模块的角度？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！