小编ats*_*uab的帖子

如何在ui-router中继承解析数据

我这里有一个棘手的情况.我的父状态和子状态都覆盖了顶层的相同ui视图(index.html).所以当它从父级进入子状态时,范围会被破坏(我认为?)基本上父级有一个存储在MetricData属性中的解析,我似乎无法从子级访问它,因为它没有嵌套我假设.有没有办法在子节点中获取该metricdata属性,而无需在子节点中再次手动调用相同的ajax调用

父母国家

     .state("home.metric", {
      url: "/category/:categoryId/metric/:metricId/name/:metricName",
      views: {

        'main@': {

          templateUrl:
            function (stateParams){
              //move this to a util function later
              var tempName = unescape(stateParams.metricName);
              tempName = tempName.replace(/\s/g, "-");

              return '../partials/slides/' + tempName + '.html';
            },
          resolve: {
            MetricData: ['MetricService', '$stateParams', 
              function(MetricService,    $stateParams){
                var data = { categoryId : $stateParams.categoryId, metricId : $stateParams.metricId};
                return MetricService.getMetricDetails(data);
              }]
          },
          controllerProvider: 
            function ($stateParams) {
              var tempName = unescape($stateParams.metricName);
              tempName = tempName.replace(/\s+/g, '');

              return tempName + 'Ctrl';
            }
        }
      }

    })
Run Code Online (Sandbox Code Playgroud)

孩子的状态

.state("home.metric.detail", {
      url: …
Run Code Online (Sandbox Code Playgroud)

angularjs angular-ui-router

12
推荐指数
1
解决办法
1万
查看次数

如何在指令中对隔离范围进行单元测试

我试图对一个简单的指令进行单元测试,但是范围中的变量总是未定义的.

指令Src代码:

.directive('ratingButton', ['$rootScope',


function($rootScope) {
      return {
          restrict: "E",
          replace: true,
          template: '<button type="button" class="btn btn-circle" ng-class="getRatingClass()"></button>',
          scope: {
              buttonRating: "="
          },
          link: function(scope, elem, attr) {
              scope.getRatingClass = function() {
                  if (!scope.buttonRating)
                      return '';
                  else if (scope.buttonRating.toUpperCase() === 'GREEN')
                      return 'btn-success';
                  else if (scope.buttonRating.toUpperCase() === 'YELLOW')
                      return 'btn-warning warning-text';
                  else if (scope.buttonRating.toUpperCase() === 'RED')
                      return 'btn-danger';
                  else if (scope.buttonRating.toUpperCase() === 'BLUE')
                      return 'btn-info';
              }
          }
      };
  }])
Run Code Online (Sandbox Code Playgroud)

测试:

describe('Form Directive: ratingButton', function() {

    // load the controller's module …
Run Code Online (Sandbox Code Playgroud)

unit-testing jasmine angularjs angularjs-directive karma-runner

12
推荐指数
1
解决办法
1万
查看次数

多个画布层上的碰撞检测

我正在努力弄清楚如何检测在不同画布层上绘制的资产上的碰撞.我制作了两个数组来保存我想要与被称为collidable_objects_layer1和collidable_objects_layer2"碰撞"的东西.这些数组基本上绘制了背面的表格和墙壁,角色不应该通过它们.

bar.js基本上保存了你在下面的链接中看到的整个栏"场景".和main.js是让我的玩家移动的循环.我认为我的架构搞砸了,因为我没有看到将这两者结合在一起的简单方法所以对此有任何建议(这里是必要的模块还是只是伤害了我?).它现在的方式我不知道如何用不同的碰撞测试添加更多的"场景".

我假设碰撞测试发生在主循环中

function main() {
    var now = Date.now();
    var dt = (now - last_time) / 1000.0;

    clearCanvas();
    drawCharacter();
    frame++;
    last_time = now;
    requestAnimFrame(main);
}
Run Code Online (Sandbox Code Playgroud)

所以有几个问题,算法(伪代码)会让我的播放器在bar.js中检测到这些可碰撞的对象.第二,我的架构适合处理多个场景,例如,一旦玩家离开"栏"到"外面"(outside.js),我该如何处理转换,这样我的玩家就可以检测到物体而不管它的"场景".我觉得我最终得到了一个Scene类或其他东西,我不确定.

提前致谢.在这里找到plunk链接

javascript 2d canvas collision-detection

6
推荐指数
1
解决办法
165
查看次数

使用Angular ui-router基于状态参数加载控制器

我试图加载一个基于stateparam的控制器,使其可重用

.state("dashboard.item.detail", {
    url: "/detailId/:detailId/detailName/:detailName",
    views: {
       'main@': {
            templateUrl: function ($stateParams){
                //move this to a util function later
                var tempName = unescape($stateParams.detailName);
                tempName = tempName.replace(/\s/g, "-");
                return '../partials/slides/' + tempName + '.html';
            },
            resolve: {
                DetailData: ['DetailService', function(DetailService){
                    return DetailService.getDetails();
                }]
            },
            controller: function ($stateParams) {
                console.log( $stateParams.detailName + 'Ctrl');
                return $stateParams.detailName + 'Ctrl';
            }
        }
      }
})
Run Code Online (Sandbox Code Playgroud)

调节器

    .controller('NemtCtrl', ['$scope', '$rootScope', 'DetailData', function ($scope, $rootScope, detailData) {
    console.log(detailData);
}]);
Run Code Online (Sandbox Code Playgroud)

如果我删除该功能并且只是使用(控制台将记录detailData),控制器将工作

controller: 'NemtCtrl'
Run Code Online (Sandbox Code Playgroud)

但如果我这样做,将不起作用:

controller: function ($stateParams) {
    return …
Run Code Online (Sandbox Code Playgroud)

javascript controllers angularjs angular-ui-router

2
推荐指数
1
解决办法
1838
查看次数

如何在使用 d3 绘制的 SVG 地图上显示国家名称标签?

我目前在尝试在 d3 世界地图上显示国家/地区名称时遇到问题。

这是显示国家/地区名称的传单示例的图像。这将是我想添加到我的 d3 版本中的内容。如果可能的话,只需国家名称。如果没有,我总是可以走传单路线,但我想我会先在 d3 尝试。

在此输入图像描述

这是d3版本

在此输入图像描述

这是我目前绘制地图的方式

    // reference to actual element d3 selects
    this.svg = d3.select(this.mapContainer.nativeElement)
        .append('svg')
        .attr('width', this.width)
        .attr('height', this.height)
        .call(zoom)
        .append('g')
        .attr('class', 'map');

    this.projection = d3.geoMercator()
        .scale(225)
        .translate([this.width / 2, this.height / 1.5]);

    const path = d3.geoPath().projection(this.projection);

    let g = this.svg.append('g');

    // if unknown is not in the filter set remove it from the json
    const filteredWorldMapJson = this.worldMapJson.features;

    // features are a list of countries
    // ex: { type: 'Feature', properties: { name: …
Run Code Online (Sandbox Code Playgroud)

javascript svg d3.js

1
推荐指数
1
解决办法
3319
查看次数