Question

我无法使用角度工厂服务获取我的json数据。我似乎正确加载文件，在开发人员工具控制台上没有错误，仍然在请求上未定义数据 - 意味着空。

我的json文件：

{
  "Translations": [
    {
      "WhatsNew": [
        {
          "English": "Whats New",
          "Hebrew": "מה חדש?",
          "Arabic": "الجديد في الموقع"
        }

      ],
      "SearchByWord": [
        {
          "English": "Search By Word",
          "Hebrew": "חיפוש לפי ערך",
          "Arabic": "البحث حسب الكلمة"
        }
      ],
      "SearchByRoot": [
        {
          "English": "Search By Root",
          "Hebrew": "חיפוש לפי שורש",
          "Arabic": "البحث حسب الجذر"
        }
      ],
      "HebrewArabicIndex": [
        {
          "English": "to the Hebrew-Arabic Index",
          "Hebrew": "לאינדקס העברי-ערבי",
          "Arabic": "إلى الفهرس العبري- العربي"
        }
      ],
      "ArabicHebrewDictionary": [
        {
          "English": "to the Arabic-Hebrew Dictionary",
          "Hebrew": "למילון הערבי-עברי",
          "Arabic": "إلى القاموس العربي- العبري"
        }
      ],
      "ExamplesAndNotes": [
        {
          "English": "Examples and Notes",
          "Hebrew": "דוגמאות והערות",
          "Arabic": "أمثلة    وملاحظات"
        }
      ],
      "IdiomsAndExpressions": [
        {
          "English": "Idioms and Expressions",
          "Hebrew": "ביטויים וצירופים",
          "Arabic": "تعابير لغوية"
        }
      ],
      "WordsFromSameRoot": [
        {
          "English": "Words From Same Root",
          "Hebrew": "ערכים מאותו השורש",
          "Arabic": "مشتقات الجذر"
        }
      ],
         "SearchResults": [
        {
          "English": "Search Results",
          "Hebrew": "תוצאות החיפוש",
          "Arabic": "نتائج البحث"
        }
      ]
    }
  ]
}

JS档案：

adicApp.factory('langService', function ($http) {
    return {
        getLanguage: getLanguage,
        setLanguage: setLanguage,
        getLangRes: getLangRes
    };

    var _lang;
    function getLanguage() {
        return _lang;
    }
    function setLanguage(lang) {
        _lang = lang;
    }

    function getLangRes(lang) {
        var langRes;

        _lang = lang;

        switch (lang) {
            case "English":
                langRes = getEnglishLangRes();
                break;

            case "Hebrew":
                langRes = getHebrewLangRes();
                break;

            case "Arabic":
                langRes = getArabicLangRes();
                break;

            default:
                langRes = getEnglishLangRes();
                break;
        }

        return langRes;
    }

    function getEnglishLangRes() {
        var res = [];
            //{
            //    Partial1_Key: "Partial 1",
            //    Partial2_Key: "Partial 2",
            //    Search_String_Value_Key: "Search String Value",
            //    Count_Of_Words_Key: "Count Of Words",
            //    Data_Id_Key: "Data ID",
            //    Value_Key: "Value",
            //    Search_Category_Key: "Search Category",
            //    Whats_New: null
            //};
        $http.get('../Scripts/Languages/languages.json').success(function (data) {
              res = data.translations
        })
        .error(function (data, status, headers, config) {
            alert("Status: " + status);
            //$log.error('Problem on selectCountry api Cities :' + status);
        });

        return res;
    }

    function getHebrewLangRes() {
        var res =
            {
                Partial1_Key: "חֵלֶק 1",
                Partial2_Key: "חֵלֶק 2",
                Search_String_Value_Key: "ערך מחרוזת חיפוש",
                Count_Of_Words_Key: "ספירת מילים",
                Data_Id_Key: "מספר מזהה",
                Value_Key: "ערך",
                Search_Category_Key: "חיפוש קטגוריה"
            };

        return res;
    }

    function getArabicLangRes() {
        var res =
            {
                Partial1_Key: "الجزء 1",
                Partial2_Key: "الجزء 2",
                Search_String_Value_Key: "قيمة سلسلة البحث",
                Count_Of_Words_Key: "عدد الكلمات",
                Data_Id_Key: "رقم الهوية",
                Value_Key: "القيمة",
                Search_Category_Key: "فئة البحث"
            };

        return res;
    }
});

并查看：

 <div class="hidden-xxs hidden-xs hidden-sm col-md-3 col-lg-4">
            <div id="scrolling-news-sidebar" class="sidebar">
                <h2>{{langRes.WhatsNew[0]}}</h2>
                <div class="marquee">

知道它为什么不起作用吗？我很茫然。我试着通过网络寻找答案，到目前为止似乎没有帮助。我认为我的json存在问题，但我发现我的文件没有任何可疑之处。

Answer 1

$ http请求成功和失败回调不再像咖喱函数那样“成功”或“错误”。它们基于Promises概念。所以会有一个“当时”的咖喱功能，它的控制块内会有成功和错误。

AngularJS 1.4 Library支持您使用的格式。因此，请先检查您正在使用的Angular版本。

如果您使用的是最新的AngularJS 1.6库，请按以下格式设置您的请求 -

$http.get('data.json').then(function success(data) {
      console.log(data)
}, function error(res){
      console.log(res);
});

我在Plunker中检查了这个并且工作正常。 https://embed.plnkr.co/eoLHfd3gzbTLAXdnNVXi/

Answer 2

首先，return你的承诺：

.zip

当function getEnglishLangRes() { var res = []; //{ // Partial1_Key: "Partial 1", // Partial2_Key: "Partial 2", // Search_String_Value_Key: "Search String Value", // Count_Of_Words_Key: "Count Of Words", // Data_Id_Key: "Data ID", // Value_Key: "Value", // Search_Category_Key: "Search Category", // Whats_New: null //}; ͟r͟e͟t͟u͟r͟n͟ $http.get('../Scripts/Languages/languages.json') ̶.̶s̶u̶c̶c̶e̶s̶s̶ .then(function (response) { var data = response.data res = data.translations ͟r͟e͟t͟u͟r͟n͟ res; }) ̶.̶e̶r̶r̶o̶r̶ .catch(function (response) { var status = response.status; alert("Status: " + status); //$log.error('Problem on selectCountry api Cities :' + status); //IMPORTANT throw response; }); ̶r̶e̶t̶u̶r̶n̶ ̶r̶e̶s̶;̶ }方法响应处理程序忽略时，throw statement 将拒绝的承诺转换为履行承诺。

无法使用角度工厂服务获取json数据

2 个答案: