且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

如何将变量传递给 Angular UI Bootstrap Datepicker 自定义类

更新时间:2023-01-10 15:07:56

您可以尝试将 'chosenUser' 存储到数组中,而不是使用普通的 javascript 对象表示法.类似的东西:

function CalendarController() {var vm = 这个;//这是我试图传递给 getDayClass 的变量vm.chosenUser = ["UserNameWillBeHere"];//选项传递给引导程序日期选择器vm.options = {自定义类:getDayClass};//这是我使用 NG-click 从 HTML 运行并执行的功能//FUNCTION getDayClass(除其他外)vm.refresh = 函数(){$("#calendar").data("$uibDatepickerController").refreshView();}函数 getDayClass(data) {var date = data.date,模式=数据.模式;//返回未定义(仅在此函数内)//即使在用户被选择之后console.log(vm.chosenUser[0]);...};}

I'm trying to pass a two-way data binded variable to Angular-UI-Bootstrap Datepicker customClass. But the data binding doesn't work inside my customClass function, it just gives me the value I initialized chosenUser variable with.

Example:

  1. I load the site and getDayClass gets called with data initialized in chosenUser (undefined in this case)
  2. I choose an user from the site and the two-way data bind works correctly everywhere else but in getDayClass function
  3. So in getDayClass chosenUser is still displayed as undefined, even though it isn't

So any changes made to variables after the first load of getDayClass don't get passed inside that function. I just can't understand why it doesn't work in there.

Here is a stripped version of my angular controller code:

function CalendarController() {
   var vm = this;

   //THIS IS THE VARIABLE (USER OBJECT) I'M TRYING TO PASS TO getDayClass
   vm.chosenUser = {};

   //OPTIONS PASSED TO BOOTSTRAP DATEPICKER
   vm.options = {
        customClass: getDayClass
   };

   //THIS IS THE FUNCTION I RUN FROM HTML WITH NG-CLICK AND IT EXECUTES 
   //FUNCTION getDayClass (AMONG OTHER THINGS)
   vm.refresh = function() {
      $("#calendar").data("$uibDatepickerController").refreshView();
   }

   function getDayClass(data) {
       var date = data.date,
       mode = data.mode;

      //RETURNS UNDEFINED (ONLY INSIDE THIS FUNCTION) 
      //EVEN AFTER USER HAS BEEN CHOSEN
      console.log(vm.chosenUser);
       ...
   };
}

You could try to store 'chosenUser' into an array instead of using plain javascript object notation. Something like:

function CalendarController() {
       var vm = this;

       //THIS IS THE VARIABLE I'M TRYING TO PASS TO getDayClass
       vm.chosenUser = ["UserNameWillBeHere"];

       //OPTIONS PASSED TO BOOTSTRAP DATEPICKER
       vm.options = {
            customClass: getDayClass
       };

       //THIS IS THE FUNCTION I RUN FROM HTML WITH NG-CLICK AND IT EXECUTES 
       //FUNCTION getDayClass (AMONG OTHER THINGS)
       vm.refresh = function() {
          $("#calendar").data("$uibDatepickerController").refreshView();
       }

       function getDayClass(data) {
           var date = data.date,
           mode = data.mode;

          //RETURNS UNDEFINED (ONLY INSIDE THIS FUNCTION) 
          //EVEN AFTER USER HAS BEEN CHOSEN
          console.log(vm.chosenUser[0]);
           ...
       };
    }