AngularJS参考其他页面

时间:2015-08-27 15:07:36

标签: html angularjs razor

我尝试创建代码,根据选择的选项动态输出到其他HTML页面的多个链接,当点击链接时,它会将您带到该页面。我设法让页面链接以我想要的方式显示在页面上,但是当点击链接时,我收到404错误。我使用Razors @Url.Action代码来调用angularjs {{ expression }}这可能是问题,但我不确定。如果我现在拥有的代码可以调整到很好的工作,但是如果你有一个不同的角度指令来完成工作也会很好。

HTML

// Repeats all the available options until there are none left
<div style="text-align:center" ng-repeat="page in pages">
    // Grabs the page name from the angular controller
    <a ng-href="@Url.Action("{{ page.name }}", "Dashboards")">{{ page.name }}</a>
</div>

AngularJS

app.controller('FormController', ['$scope', function ($scope) {

          var groupOne = [            
            { name: 'BudgetComparison' }
          ];

          var groupTwo = [
            { name: 'Optimize' },
            { name: 'Construction Program' },
            { name: 'BudgetCharts' }               
          ];

          var groupThree = [               
            { name: 'Import' }  
          ];

          var groupFour = [
            { name: 'EDITBudgetAmounts' },
            { name: 'ReviewAndAdjust' },
            { name: 'Export' },
            { name: 'ExportStrategies' }
          ];

          $scope.$watch("displayOption", function (displayOption) {
              if (displayOption) {
                  var value1 = displayOption.fiftyMill;
                  var value2 = displayOption.hundredMill;
                  var value3 = displayOption.statusQuo;
                  var value4 = displayOption.doNothing;

                  $scope.pages = null;
                  $scope.message = null;

                    if (value1 === true && value2 === true && value3 === true) {
                        $scope.pages = groupOne.concat(groupTwo);
                    }else if ((value1 === true || value2 === true) && value3 === true) {
                        $scope.pages = groupTwo;
                    }else if (value1 === true && value2 === true) {
                        $scope.pages = groupOne;
                    } else if (value1 === true || value2 === true || value3 === true) {
                        $scope.pages = groupFour;
                    } else if(value4 === true) {
                        $scope.message = 'No Options';
                    } else {
                        $scope.pages = groupThree;
                    }
              }
          }, true);
}]);

1 个答案:

答案 0 :(得分:1)

ASP.NET MVC对从Url.Action生成的url进行编码,您需要对其进行解码。您可以使用@Html.Raw()或类似的内容:

@{
  var url = Url.Action("{{ page.name }}", "Dashboards");
  url = url = HttpUtility.UrlDecode(url);
}

...

<a ng-href="@url">{{ page.name }}</a>