Ng-change doesn't work with <tm1-ui-subnm> and <tm1-ui-dbr>


#1

Hi Guys,

I found an angular standard directive ng-change doesn’t work with canvas tm1-ui-subnm, tm1-ui-dbr.
To make sure it’s not my application issue, I did test it on samlples application as well.

It does work with a hardcoded list:

<!-- html -->
<select  class="form-control" ng-model="page.SomeVariable" 
            ng-change="page.AlertSomething(page.SomeVariable)">
                     <option value="Something1">Something1</option>
                     <option value="Something2">Something2</option>
                     <option value="Something3">Something3</option>
 </select>
// JS
$scope.page.AlertSomething = function(Something){
    alert(Something);
};

but unfortunately it doesn’t work with subnm

          <tm1-ui-subnm tm1-instance="dev"
                        tm1-dimension="Department" 
                        tm1-attribute="Description"
                        tm1-default-element="{{$root.$stateParams.dept?$root.$stateParams.dept:'6'}}" 
                        tm1-select-only="true"
                        ng-model="page.title.department"
                        ng-change="page.AlertSomething(page.title.department)">
         </tm1-ui-subnm>

So it looks it wasn’t implemented. For now I see the only one way how to use subset and ng-change simultaneously is to use and generate list with ng-repeat…
Is there any other idea how to run a function when selected new element in subnm?


#2

Hi @eugene,

You should use tm1-change instead, ng-change is built into angular and can’t be used on our directives.


#3

@tryan,

It looks this is a new attribute. I didn’t see it in the first Canvas versions. Looks I need to review all canvas components again. Thank you!


#4

Hi @tryan,

I did try to use tm1-change and found that tm1-change works different from ng-change. Whether ng-change shows current selected element, tm1-change shows previous selected one. So tm1-change works one step behind. it looks its $scope is not updated.

<!-- HTML -->
          <tm1-ui-subnm tm1-instance="dev"
                        tm1-dimension="Department" 
                        tm1-attribute="Code and Description"
                        tm1-default-element="{{$root.$stateParams.dept?$root.$stateParams.dept:'6'}}" 
                        tm1-select-only="true"
                        ng-model="page.title.department"
                        tm1-change="page.AlertSomething(page.title.department)">
         </tm1-ui-subnm>
         test:
          <select  class="form-control" ng-model="page.SomeVariable" ng-change="page.AlertSomething(page.SomeVariable)">
                     <option value="Something1">Something1</option>
                     <option value="Something2">Something2</option>
                     <option value="Something3">Something3</option>
          </select>
// JS
$scope.page.AlertSomething = function(Something){
   // alert(Something);
    $scope.page.getSomething = Something;
   console.log($scope.page.getSomething);
};

#5

Hi @eugene,

That is a bug can you please create a ticket so we can get that fixed.


#6

Hi @eugene,

And in the meantime, try to use ‘data’ as the name of the parameter on the function below:

To:

For your function to received the correct element selected.

And as advised, please do create a ticket for this.

Cheers!
Paul


#7

Hi @plim,

Thanks. tm1-change=“page.AlertSomething(data)” does work - I can pass data as a variable to a function.
As advised I will create a ticket for this.


#8

Hi Guys. I’m seeing the same issue, where ng-change shows the previous value. Did this get fixed?

I will look at using the data scope.

Brian


#9

Hi @bknott,

Yes it is fixed and will be part of the next release.

In the meantime, as detailed above, use a function that has ‘data’ as one of the parameters.

Cheers!
Paul