3

angularのサービス/プロバイダー/ファクトリーモジュールは初めてです。私はannyangというライブラリを 30 分間使用してきましたが、このライブラリをより「角度のある」方法で使用したいと考えていました。

git に依存しない人がここにある moduleProvider を作成しました: ngAnnyang。

適切に使用する方法に関するドキュメントはありません。

しかし、あなたが実行するだけの伝統的なアンニャン：

var commands = {
  'remind me to *val' : reminders,
};

annyang.addCommands(commands);
annyang.start();

質問: モジュールを角度アプリケーションに挿入した後:

  1. このモジュールは同じように実装されますか、それともコマンドにはnglike:という接頭辞が付けられngAnnyang.addCommands(); ngAnnyang.start();ますか?

  2. アプリのスクリプト タグとして annyang の元の lib を使用する必要がありますか?

  3. この角度のあるラッパーで、注入できるようになったことを除いて、それを「角度のある」ものにしているのは何ですか?

JS:ng-アンニャン

    /**
* ngAnnyang Module
*
* Annyang Angular wrapper
*/
angular.module('ngAnnyang', ['ng'])
  .provider('ngAnnyang', function ngAnnyangProvider() {
    'use strict';

    var isEnabledFn = function() {};

    // events
    console.log('ngAnnyang: set events');
    annyang.addCallback('start', function() {
      console.log('ngAnnyang: enabled true');
      isEnabledFn(true);
    });
    _.each(['end', 'error', 'errorNetwork', 'errorPermissionBlocked', 'errorPermissionDenied'], function(v) {
      annyang.addCallback(v, function() {
        console.log('ngAnnyang: enabled false');
        isEnabledFn(false);
      });
    });

    console.log('ngAnnyang: start');
    annyang.start();

    this.debug = function(state) {
      if(state){
        console.log('ngAnnyang: set debug', !!state);
        annyang.debug(!!state);

      } else {
        console.log('ngAnnyang: set debug', true);
        annyang.debug();
      }
    };

    this.setLanguage = function(lang) {
      if(lang){
        console.log('ngAnnyang: debug', ''+lang);
        annyang.setLanguage(''+lang);
      }
    };

    this.$get = function ngAnnyangFactory(){
      return {
        isEnabled: function(fn) {
          console.log('ngAnnyang: isEnabled callback', fn);
          isEnabledFn = fn;
        },
        addCommands: function(commands) {
          console.log('ngAnnyang: add commands', commands);
          annyang.addCommands(commands);
        },
        removeCommands: function(commands) {
          console.log('ngAnnyang: remove commands', commands);
          annyang.removeCommands(commands);
        }
      };
    };
  });
4

2 に答える 2

1

以下を使用する必要があります。

angular.module("アプリ名").config("ngAnnyangProvider", function( ngAnnyangProvider) {

ngAnnyangProvider.addCommands (...);

});

詳細については：

https://docs.angularjs.org/guide/module

于 2014-10-14T00:00:37.857 に答える
1

このモジュールは同じように実装されますか、それともコマンドには nglike: という接頭辞が付けられますngAnnyang.addCommands(); ngAnnyang.start();か?

プロバイダーがインスタンス化されるとすぐに ngWrapper がサービスを開始するようです。同じように使用します。

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

app.controller('SpeechRecognize', ['ngAnnyang','tpsService',function(speechRecognition, tpsService) {
    var commands = {
        'show tps report': function() {
          tpsService.show();
        }
    };
    speechRecognition.addCommands(commands);
}]);

アプリのスクリプト タグとして annyang の元の lib を使用する必要がありますか?

はい、これは元のライブラリのラッパーにすぎないためです。

この角度のあるラッパーで、注入できるようになったことを除いて、それを「角度のある」ものにするのは何ですか?

それが提供する唯一の利点のようです。これにより、テストも容易になります。

于 2014-10-14T00:02:20.720 に答える