0

私は MEAN-STACK アプリケーションを構築しており (これは私にとっては新しいことです)、このテンプレートから始めました: https://github.com/linnovate/mean

モジュール（cloudinaryと呼ばれる）を追加したいので、これに従いました： http://cloudinary.com/documentation/node_image_upload#direct_uploading_environment_setup

（npmのインストール、bowerなど....完了）

私はこの行で立ち往生しています（それを行う方法がわかりません）：

cloudinary.uploader.image_upload_tag('image_id', { callback: cloudinary_cors });

私のアプリには、コントローラーとサービスがあります。これをコントローラーに入れると、「cloudinary is undifined」というメッセージが表示されます。サービスファイルに入れるべきかもしれませんが、方法がわかりません。コントローラーから「cloudyPost()」関数を呼び出すファイルをアップロードすることになっている入力を使用して、html ページにフォームを作成します。

これが私のコントローラー、サービス、およびページのコードです。

mycars.js (サービス):

//Cars service used for car REST endpoint
angular.module('mean.mycars').factory('Cars', ['$resource', function($resource) {
 return $resource('cars/:carId', {
     carId: '@_id'
 }, {
     update: {
         method: 'PUT'
     }
 });
}]);

mycars.js (コントローラー):

angular.module('mean.mycars').controller('MyCarsController', ['$scope', '$http', '$stateParams', '$location', 'Global', 'Cars',
function ($scope, $http, $stateParams, $location, Global, Cars) {

 $scope.cloudPost = function() {
        cloudinary.uploader.image_upload_tag('image_id', { callback: cloudinary_cors });
    };

[.... some other  code ....]
 }

私のHTMLページ：

<section data-ng-controller="MyCarsController" data-ng-init="findOneOrCreate()">
   <form role="form" data-ng-submit="cloudyPost()">
      <p>Public ID: <input type="text" name="title"/></p>
      <p>Image: <input type="file" name="image"/></p>
      <p><button type="submit" class="btn btn-default">Send to Cloudy!</button>  </p>      
    </form>
</section>

これらすべてを統合して機能させるのを手伝ってくれませんか。ありがとうございました。

最後に私のページに含まれている js をここに追加します):

<script type="text/javascript" src="/lib/angular/angular.js"></script>
<script type="text/javascript" src="/lib/angular-cookies/angular-cookies.js"></script>
<script type="text/javascript" src="/lib/angular-resource/angular-resource.js"></script>
<script type="text/javascript" src="/lib/angular-ui-router/release/angular-ui-router.js"></script>
<script type="text/javascript" src="/lib/angular-bootstrap/ui-bootstrap.js"></script>
<script type="text/javascript" src="/lib/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script type="text/javascript" src="/lib/jquery/dist/jquery.js"></script>
<script type="text/javascript" src="/lib/ng-grid/build/ng-grid.js"></script>
<script type="text/javascript" src="/lib/cloudinary/js/jquery.ui.widget.js"></script>
<script type="text/javascript" src="/lib/cloudinary/js/jquery.iframe-transport.js"></script>
<script type="text/javascript" src="/lib/cloudinary/js/jquery.fileupload.js"></script>
<script type="text/javascript" src="/lib/cloudinary/js/jquery.cloudinary.js"></script>
<script type="text/javascript" src="/js/app.js"></script>
<script type="text/javascript" src="/js/config.js"></script>
<script type="text/javascript" src="/js/controllers/articles.js"></script>
<script type="text/javascript" src="/js/controllers/car.js"></script>
<script type="text/javascript" src="/js/controllers/header.js"></script>
<script type="text/javascript" src="/js/controllers/index.js"></script>
<script type="text/javascript" src="/js/controllers/mycars.js"></script>
<script type="text/javascript" src="/js/directives.js"></script>
<script type="text/javascript" src="/js/filters.js"></script>
<script type="text/javascript" src="/js/init.js"></script>
<script type="text/javascript" src="/js/services/articles.js"></script>
<script type="text/javascript" src="/js/services/cars.js"></script>
<script type="text/javascript" src="/js/services/global.js"></script>
<script type="text/javascript" src="/js/services/mycars.js"></script>

<!-- Livereload script rendered -->
<script type="text/javascript" src="http://localhost:35729/livereload.js"></script>
4

0 に答える 0