Question

要在复选框上单击更改textValue opacity属性这是控制器中的代码。

var textvalue = gs.selectAll("text")
                        .data(function (d) { return pie(d); })
                        .enter().append("text")
                        .attr("opacity", function (d, i) {
                            while (d.id != 0) {
                                if (d.phase == "Something") return "1";
                                else { return 0.5; }
                            }
                        })
                        .text(function (d) { return d; })
                        .on("click", function (d) {
                            if (d.id != 0) {
                                window.open("A link");
                            }
                        })

点击一个复选框我称之为此方法。

  function callMonitor() {
    alert('in monitor ');
    var appElement = document.querySelector('[ng-app=TechRadarApp]');
    var $scope = angular.element(appElement).scope();
    $scope = $scope.$$childHead;
    $scope.$apply(function () {
        $scope.gs.selectAll("text")
                        .data(function (d) { return pie(d); })
                        .enter().append("text")
                        .attr("opacity", function (d, i) {
                             while (d.id != 0) {
                                if (d.phase == "Something else") return "1";
                                else { return 0.5; }
                            }
                        })
                        .text(function (d) { return d; });
    });

你能帮我弄清楚如何从call monitor方法改变gs.selectAll（“text”）。我是anular和java脚本的新手，不知道如何访问元素。

这是我的控制器初始化的方式

 MyApp.controller('MyController', ['$scope', 'MyService', function ($scope, MyService) {
    getData();
    function getData() {
        MyService.getTechData()
            .success(function (returndata) {
            A lot of code

               } ]);

这与初始化控制器的常规方式不同。这会改变我从外部访问控制器内部元素的方式。

这是通常的声明。（从有角度的网站复制）

myApp.controller('GreetingController', ['$scope', function($scope) {
  $scope.greeting = 'Hola!';
}]);

Answer 1

代码的问题在于您在text函数中创建了新的callMonitor DOM元素：

    $scope.gs.selectAll("text")
    .data(function (d) { return pie(d); })
    .enter()
    .append("text")//this will create new text DOM elemnet for the data
    .attr("opacity", function (d, i) {
                                 while (d.id != 0) {
                                    if (d.phase == "Something else") return "1";
                                    else { return 0.5; }
                                }
                            })
      .text(function (d) { return d; });

正确的方法是您不创建任何text DOM，因为我假设您在调用此callMonitor函数之前必须已经这样做了。

所以它应该是这样的：

$scope.gs.selectAll("text")
        .attr("opacity", function (d, i) {
                     while (d.id != 0) {
                       if (d.phase == "Something else") return "1";
                               else { return 0.5; }
                       }
                     });

希望这有帮助！

更新角度d3文本onclick

1 个答案: