Question

好的，我知道以下代码是错误的，因为它不起作用。但希望它能帮助我描述我想要做的事情：

Choose a new background color for the site:&nbsp;
<select name="bgcolor" onChange="ModifyColorsInLess();" id="bgcolor" ng-change="changeCurrent('bgcurrent');">
<option ng-repeat="color in colorlist" value="{{color}}" ng-selected="color==bgcurrent" >{{color}}</option>
</select>

现在，您将看到我想在选择中发生两件事。

1）点击JS函数ModifyColorsInLess()，这样做并完美。该函数位于常规JS文件中。这会立即改变LESS变量的实际值。

2）在changeCurrent()的控制器中点击该功能。这是尝试更改Angular控制器中设置的范围变量的值。

我试图找出如何使代码同时执行这两项工作。

编辑：控制器代码：

app.controller('HomeController', ['$scope', '$location', '$sce', '$routeParams', '$timeout', function($scope, $location, $sce, $routeParams, $timeout ) {
// Configuration Variables:
$scope.title = "Site Title";
$scope.logosrc = "images/site_logo.gif";
$scope.tagline = "This is the new tagline!!!";
$scope.bgcurrent = "White";
$scope.pccurrent = "Black";
$scope.sccurrent = "LightGray";
$scope.dtccurrent = "Black";
$scope.ltcurrent = "LightGray";

// This changes the shadowed aspect of the top nav and footer based on a checkbox
$scope.shadowChange = function(cb){
    var isChecked = (document.getElementById('shadow').checked);
    if(isChecked){
        $('#footer').addClass('shadowed');
        $('.nav').addClass('shadowed');
        $('.show-menu').addClass('shadowed');
    }else{
        $('#footer').removeClass('shadowed');
        $('.nav').removeClass('shadowed');
        $('.show-menu').removeClass('shadowed');
    };
    return true;
};
// This converts any HTML code in the text to actual code so that it renders properly
$scope.renderHtml = function(html_code)
{
    return $sce.trustAsHtml(html_code);
};

// This sets a default value for the passed parameter. $routeParams.action in this example
if(!(typeof $routeParams.action === 'undefined')){
    $scope.pageAction = $routeParams.action;
}
else{
    $scope.pageAction = "home";
}

// This changes a default color
$scope.changeCurrent = function(varname){
    alert(varname);
//      $scope[varname] = valname;
};


}]);

在select中混合onChange和ng-change

0 个答案: