2016-08-31 3 views
0

AngularJS와를 사용하기 전에 나는AngularJS와 + ASP.NET MVC 통화 컨트롤러 액션

$.ajax({ 
     url: '@Url.Action("getGamedata", "Home")', 
     type: 'GET', 
     dataType: 'json', 
     cache: false, 
     async: false, 
     success: function (gameInfo) { 
      //alert(gameInfo.Name); //Working OK 
      for(var i=0;i<6;i++) 
       createTable(gameInfo[i]); 
     } 
    }); 

JSON 결과 지금 난 등 이름, 장르, 이미지 URL 6 개 항목을 포함하고 기능의 JSON 결과를 얻기 위해이 코드를 사용 AngularJS를 사용하여 동적 격자를 만드는 기능이 있습니다.

function buildGridModel(tileTmpl) { 
      var it, results = []; 

      for (var j = 0; j < 6; j++) { 

       it = angular.extend({}, tileTmpl); 
       it.icon = it.icon + (j + 1); 
       it.title = it.title + (j + 1); 
       it.span = { row: 1, col: 1 }; 

       switch (j + 1) { 
        case 1: 
         it.background = "red"; 
         break; 

        case 2: it.background = "green"; break; 
        case 3: it.background = "darkBlue"; break; 
        case 4: 
         it.background = "blue"; 
         break; 

        case 5: 
         it.background = "yellow"; 
         break; 

        case 6: it.background = "pink"; break; 
       } 

       results.push(it); 
      } 

      return results; 
     } 

각 항목 제목을 그리드 타일 제목으로 푸시합니다.

  1. 1 타일 제목 = 1 JSON 항목 제목
  2. 2 타일 제목 = 2 JSON 항목 제목
+0

지금까지 시도한 코드를 게시 할 수 있습니까? –

답변

0

내 솔루션 : 넣어 아약스 기능에

function buildGridModel(tileTmpl) { 
      var it, results = []; 
      $.ajax({ 
       url: '/home/getGamedata', 
       type: 'GET', 
       dataType: 'json', 
       cache: false, 
       async: false, 
       success: function (gameInfo) { 

        for (var j = 0; j < 6; j++) { 

         it = angular.extend({}, tileTmpl); 
         it.icon = it.icon + (j + 1); 
         it.title = gameInfo[j]["Name"]; 
         it.span = { row: 1, col: 1 }; 

         switch (j + 1) { 
          case 1: 
           it.background = "red"; 
           break; 

          case 2: it.background = "green"; break; 
          case 3: it.background = "darkBlue"; break; 
          case 4: 
           it.background = "blue"; 
           break; 

          case 5: 
           it.background = "yellow"; 
           break; 

          case 6: it.background = "pink"; break; 
          case 7: it.background = "darkBlue"; break; 
          case 8: it.background = "purple"; break; 
          case 9: it.background = "deepBlue"; break; 
          case 10: it.background = "lightPurple"; break; 
          case 11: it.background = "yellow"; break; 
         } 

         results.push(it); 
        } 
       } 
      }); 

      return results; 
     } 
+0

질문이나 답변에 AngularJS와 관련된 내용이 없습니다. 각도 문서 https://docs.angularjs.org/api/ng/service/$http에서 $ http 서비스를 확인하십시오. –

관련 문제