javascript - Angular "ng:areq"错误，工厂问题-6ren

javascript - Angular "ng:areq"错误，工厂问题

转载作者：行者123 更新时间：2023-12-03 11:59:43

27

4

我已经设置了 Angular Factory 和 Controller ，以使用其 API 从 Instagram 中提取图像。我在尝试加载页面时遇到错误，但似乎无法找出问题所在。我的 html、应用程序、路由、工厂和 Controller 代码如下。我将测验 Controller 排除在外，因为它运行正常。我认为问题可能在于工厂，因为我刚开始使用它们。

index.html:

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <base href="/">

    <title>Starter Node and Angular</title>

    <!-- CSS -->
    <link rel="stylesheet" href="libs/bootstrap/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="css/style.css"> <!-- custom styles -->

    <!-- JS -->
    <script src="libs/jquery/dist/jquery.min.js"></script>
    <script src="libs/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="libs/angular/angular.min.js"></script>
    <script src="libs/angular-route/angular-route.min.js"></script>
    <script src="libs/angular-resource/angular-resource.min.js"></script>

    <!-- ANGULAR CUSTOM -->
    <script src="js/controllers/QuizCtrl.js"></script>
  <script src="js/controllers/InstaCtrl.js"></script>
  <script src="js/services/InstaFactory.js"></script>
    <script src="js/appRoutes.js"></script>
    <script src="js/app.js"></script>
</head>
<body ng-app="app">

    <!-- HEADER -->
    <div class="navbar-wrapper">
      <div class="container navvy">

        <div class="navbar navbar-inverse navbar-static-top" role="navigation">
          <div class="container">
            <div class="navbar-header">
              <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
              </button>
              <a class="navbar-brand" href="/">Frank Social</a>
            </div>
            <div class="navbar-collapse collapse">
              <ul class="nav navbar-nav">
                <li><a href="#">About Us</a></li>
                <li><a href="#">Sign Up</a></li>
              </ul>
            </div>
          </div>
        </div>

      </div>
    </div>

    <!-- ANGULAR DYNAMIC CONTENT -->
    <div ng-view></div>

</body>
</html>

app.js:

angular.module('app', ['ngRoute', 'appRoutes', 'InstaFactory', 'QuizCtrl', 'InstaCtrl']);

appRoutes.js:

angular.module('appRoutes', []).config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {

    $routeProvider

        // home page
        .when('/', {
            templateUrl: 'views/home.html',
            controller: 'QuizController'
        })

        // quiz page that will use the QuizController
        .when('/quiz', {
            templateUrl: 'views/quiz.html',
            controller: 'QuizController'
        })

        // insta page that will use the InstaController
        .when('/insta', {
            templateUrl: 'views/insta.html',
            controller: 'InstaController'
        });

    $locationProvider.html5Mode(true);

}]);

InstaCtrl.js:

angular.module('InstaCtrl', []).controller('InstaController', function($scope, Instagram) {

        $scope.example1 = {
            hash: 'angular'
        };

        $scope.example2 = {
            hash: 'fit'
        };

        $scope.example3 = {
            hash: 'food'
        };

        var instagramSuccess = function(scope, res) {
            if (res.meta.code !== 200) {
                scope.error = res.meta.error_type + ' | ' + res.meta.error_message;
                return;
            }
            if (res.data.length > 0) {
                scope.items = res.data;
            } else {
                scope.error = "This hashtag has returned no results";
            }
        };

        Instagram.get(9, $scope.example1.hash).success(function(response) {
            instagramSuccess($scope.example1, response);
        });

        Instagram.get(9, $scope.example2.hash).success(function(response) {
            instagramSuccess($scope.example2, response);
        });

        Instagram.get(9, $scope.example3.hash).success(function(response) {
            instagramSuccess($scope.example3, response);
        });
});

InstaFactory.js:

angular.module('InstaFactory', []).factory('Instagram', function($http) {
        var base = "https://api.instagram.com/v1";

        var clientId = 'MY-CLIENT-ID-HERE';
        return {
            'get': function(count, hashtag) {
                var request = '/tags/' + hashtag + '/media/recent';
                var url = base + request;
                var config = {
                    'params': {
                        'client_id': clientId,
                        'count': count,
                        'callback': 'JSON_CALLBACK'
                    }
                };
                return $http.jsonp(url, config);
            }
        };
});

最佳答案

您的应用程序结构似乎是错误的，因为模块用于打包可重用的代码，例如您正在定义一个新模块以在其中添加一个工厂刚刚将其添加到应用程序模块中您应该将模块视为主要模块函数并使用工厂或服务来实现特定行为，就像使用 Instagram 工厂一样。

关于javascript - Angular "ng:areq"错误，工厂问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25467514/

27

4

0

文章推荐： javascript - 从自身访问 Web 组件元素

文章推荐： python - 使用Socket进行Python UDP通信，检查收到的数据

文章推荐： amazon-web-services - 从 lambda 函数对 dynamodb 的请求非常慢

文章推荐： c# - 向现有系统类添加对象

javascript - 错误 : [ng:areq] http://errors. angularjs.org/1.2.25/ng/areq？
我需要一些帮助。只需要学习 Angular，我就是这样设置的。这是我的文件结构。关于Controller.js function AboutController( $scope ){ $sco
angularjs - 错误 : [ng:areq] http://errors. angularjs.org/1.2.12/ng/areq?p0=CustomersController&p1=not%20aNaNunction%2C%20got%20undefined
我有 Angular JS 的实践项目，描述 demoangular.html 页面 Logout.html 页面 demoangular 页面是登录页面，它重定向到 logout.html 但是 l
javascript - 错误 : [ng:areq] http://errors. angularjs.org/1.4.4/ng/areq?p0=FirstCtrl&p1=not%20a%20function%2C%20got%20undefined？
我是 angularjs 的新手，想知道我的代码有什么问题。我正在学习教程，但由于这个错误而卡住了。索引.php AngularJS {{data.mes
javascript - AngularJs错误: [ng:areq]
我收到一个[ng:areq]错误，可能很愚蠢，但我没有看穿它。做了一些研究发现没有什么帮助。演示代码: Angular Third Example
javascript - 我的应用程序中出现错误 ng-areq
我是angularjs的初学者我有前端代码 Scope Data
javascript - Angular 错误: [ng:areq]
我已经检查了有关错误 Error: [ng:areq] 的其他解决方案，大多数都说明了缺少文件功能、变量重复或覆盖模块的原因。我的controller.js代码如下，它似乎没有任何这些问题。 var
javascript - AngularJS过滤搜索结果: Error: [ng:areq]
我正在尝试在 angularjs 中过滤搜索结果，但在 chrome 控制台上收到此错误:错误:[ng:areq] 这是我的代码片段 By name Newest
javascript - Angular "ng:areq"错误，工厂问题
我已经设置了 Angular Factory 和 Controller ，以使用其 API 从 Instagram 中提取图像。我在尝试加载页面时遇到错误，但似乎无法找出问题所在。我的 html、应用
javascript - 为什么这个片段返回 "error:areq Bad Argument"？
你能解释一下为什么下面的代码返回 Error: error:areqBad Argument ？ (参见 live example ) function Simple
javascript - ng :areq error in simple app
这个问题在这里已经有了答案: Controller not a function, got undefined, while defining controllers globally (14 个答
javascript - AngularJS 错误 ng areq 不是函数
我试图让我的元 Controller 动态更改元标记，但在控制台中我收到错误 ng areq not a function。我在 StackOverflow 中搜索了类似的问题，但没有一个解决方案适合
javascript - 错误 : [ng:areq] from angular controller
这不太可能，但是有人以前见过这个错误吗？我正在尝试使用 express、angular 和 mongoDB 添加“Transporters”。每当我访问由传输 Controller 控制的页面时，我都
angularjs - 错误 : [ng:areq] Argument Controller is Not a Function
我正在尝试在我的 rails 应用程序中加载一个空白的谷歌地图应用程序(稍后我将通过 facotries 等添加标记)。这种格式在我的上一个项目中有效，但不幸的是这次我无法加载它。我通过 bower
javascript - 错误 : [ng:areq] Argument is not a function, 未定义
我试图用 Angular 制作一个简单的应用程序，我偶然发现了页面加载时弹出错误。我做错了什么？ views/raffle/index.html.erb Raffler
javascript - 错误: ng:areq Bad Argument AngularJS
我正在开发一个新的作品集网站，希望使用 AngularJS 来显示我的作品，并使用纯 css 来格式化布局等。我找到了一个有用的教程，概述了如何构建应用程序以供将来扩展，并设置了如下所示的文件树:
angularjs [ng :areq] Argument 'fn' is not a function, 得到字符串
我是 Angular js 新手..我遇到以下错误，请帮助我 [ng:areq] 参数“fn”不是函数，而是字符串 var app = angular.module('demo',[]); app.c
javascript - 我收到错误 : [ng:areq] Argument 'nameController' is not a function
出现以下错误 Error: [ng:areq] Argument 'nameController' is not a function, got undefined http://errors.ang
angularjs - 错误 : [ng:areq] Argument 'ProjectsController' is not a function, 未定义
为什么我的 ProjectsController 未定义？我从浏览器控制台收到此错误消息。你可以自己检查看看这个plunker: http://plnkr.co/edit/0DJ6W7QEPx2Uz
javascript - 错误 : [ng:areq] Argument 'GreetingController' is not a function, 未定义
我正在尝试使用 Django 进行 Angular 工作。我非常困难地让它与 Django 和 Angular 一起工作，但现在我又遇到了一个错误。每次加载它时，我都会收到以下错误。 Error: [
javascript - angularjs [ng :areq] Argument 'fn' is not a function, 在控制台错误中得到字符串
当我尝试使用 ngmockE2E 模拟后端时出现错误。 “angularjs [ng:areq] 参数 'fn' 不是函数，得到字符串” 当我删除 ngMock 服务时，它工作正常。索引.html

首页

博学

6Ren·AI

商城

javascript - Angular "ng:areq"错误，工厂问题