如何使用angularjs根据当前日期和时间禁用按钮?

时间:2022-10-03 21:53:30

I have store list with details.i have stored day wise shop open time and close time .here i need to take current day and current time and check with every store date and time(i have store opening day with open time and close time).if current day time match with store open time order button should enable.if current date and time not matcehed i need to disable button.i new to technology pls some one help me out

我有详细的商店列表。我已经存储了明智的商店营业时间和关闭时间。我需要当天和当前时间并检查每个商店的日期和时间(我有开店时间和关闭时间的商店开放日) .if当前时间与商店开放时间订单按钮匹配应该启用。如果当前日期和时间没有成功我需要禁用button.i新技术请帮我一个

Example :today is tuesday if time is 08.00PM only one store order button should enable ragu mobile service center order button demo demo.i have tried to take day and time but i can't able to take bcoz i am beginner pls some one help me out for this task.

示例:今天是星期二如果时间是08.00PM只有一个商店订单按钮应该启用ragu移动服务中心订单按钮演示demo.i已经尝试了一天和时间但我无法采取bcoz我是初学者请一些帮助我出去完成这项任务。

angular.module('myApp', [])
    .controller("myCntrl", function ($scope,$filter) {
  
    $scope.dealers = [{
        
        S_Email_id: "aditiya@gmail.com",
        S_Store: "samsung",
		status:"",
        Store_Name: "Adtiya Samsung Store",
        S_Services: "Regular Service,Software Faults,Hardware Faults",
        Store_long_description: "Undertake all kind of samsung mobiles",
        Store_short_description: "Undertake all kind of samsung mobiles",
		Day: {
        "monday": "09:10AM - 06:30PM",
        "tuesday": "09:10AM - 06:30PM",
        "wednesday": "09:10AM - 06:30PM",
        "thursday": "09:10AM - 06:30PM",
        "friday": "09:10AM - 06:30PM",
        "saturday": "10:15AM - 04:15PM",
		"sunday":"10:15AM - 04:15PM"
		},
    }, {
       
        S_Email_id: "rajs@gmail.com",
        S_Store: "nokia",
		status:"",
        Store_Name: "sri shakthi mobile service",
        S_Services: "Settings Faults,Regular Service,Hardware Faults",
        Store_long_description: "Undertake all kind of nokia mobiles",
        Store_short_description: "Undertake all kind of nokia mobiles",
		Day: {
        "monday": "09:00AM - 06:00PM",
        "tuesday": "09:00AM - 06:00PM",
        "wednesday": "09:00AM - 06:00PM",
        "thursday": "09:00AM - 06:00PM",
        "friday": "09:00AM - 06:00PM",
        "saturday": "09:00AM - 06:00PM",
		"sunday":"Leave"
		},
		
    }, {
        
        S_Email_id: "sprtive23@gmail.com",
        S_Store: "nokia,samsung",
		status:"",
        Store_Name: "sun mobile service center",
        S_Services: "Regular Service,overall maintenance,Mobile Shield Installation",
        Store_long_description: "Undertake all kind of nokia,samsung mobiles",
        Store_short_description: "Undertake all kind of nokia,samsung mobiles",
		Day: {
        "monday": "08:30AM - 07:30PM",
        "tuesday": "08:30AM - 07:30PM",
        "wednesday": "08:30AM - 07:30PM",
        "thursday": "08:30AM - 07:30PM",
        "friday": "08:30AM - 07:30PM",
        "saturday": "08:15AM - 02:15PM",
		"sunday":"8:15AM - 12:15AM"
		},
		
		},
	{
        
        S_Email_id: "super@gmail.com",
        S_Store: "nokia,samsung",
		status:"",
        Store_Name: "ragu mobile service center",
        S_Services: "Regular Service,overall maintenance,Mobile Shield Installation",
        Store_long_description: "Undertake all kind of nokia,samsung mobiles",
        Store_short_description: "Undertake all kind of nokia,samsung mobiles",
		Day: {
        "monday": "10:00AM - 10:00PM",
        "tuesday": "10:00AM - 10:00PM",
        "wednesday": "10:00AM - 10:00PM",
        "thursday": "10:00AM - 10:00PM",
        "friday": "10:00AM - 10:00PM",
        "saturday": "leave",
		"sunday":"leave"
		},
		
		
		}
    ]
 var date = new Date();
	
	$scope.hhmmsstt = $filter('date')(new Date(), 'hh:mm:ss a');
	//console.log($scope.hhmmsstt);
	}
)
<div ng-app="myApp">
    <div ng-controller="myCntrl">
        <label>Search on Label</label><br>
        <input ng-model="query" type="text" placeholder="Search for name" />
        <br><br>
        
            <div ng-repeat="dealer in dealers">
                          
                {{dealer.Store_Name}}<br>
				{{dealer.S_Email_id}}<br>
				{{dealer.Day}}<br>
                <input type="button" value="order"/>
				<br><br><br>
                    
				</div>
    
        </div>
		</div>

1 个解决方案

#1


0  

You want to use ng-disabled on your input button, with an expression comparing Today with the day of week inside dealer.Day, Then you have to split the day value by " - " to get the begin and end time, and check if now is between those two times. It needs date conversion and parsing.

你想在你的输入按钮上使用ng-disabled,用一个表达式比较今天和经销商里面的星期几。然后,你必须将日期值除以“ - ”以得到开始和结束时间,并检查是否现在介于这两次之间。它需要日期转换和解析。

angular.module('myApp', [])
  .controller("myCntrl", function($scope, $filter) {

    $scope.isOpen = function(dealerSchedule) {
      var now = new Date();
      // 09:10AM - 06:30PM
      var times = dealerSchedule[Object.keys(dealerSchedule)[now.getDay() - 1]].replace(/(\d\d\:\d\d)(AM|PM)/g, '1/1/1900 $1 $2').split(" - ");
      var nowTime = new Date('1/1/1900 ' + now.toLocaleTimeString(navigator.language, {
        hour: '2-digit',
        minute: '2-digit',
        hour12: true
      }));
      return nowTime >= new Date(times[0]) && nowTime <= new Date(times[1]);
    };

    $scope.dealers = [{

      S_Email_id: "aditiya@gmail.com",
      S_Store: "samsung",
      status: "",
      Store_Name: "Adtiya Samsung Store",
      S_Services: "Regular Service,Software Faults,Hardware Faults",
      Store_long_description: "Undertake all kind of samsung mobiles",
      Store_short_description: "Undertake all kind of samsung mobiles",
      Day: {
        "monday": "09:10AM - 06:30PM",
        "tuesday": "09:10AM - 12:00PM",
        "wednesday": "09:10AM - 10:30AM",
        "thursday": "09:10AM - 06:30PM",
        "friday": "09:10AM - 06:30PM",
        "saturday": "10:15AM - 04:15PM",
        "sunday": "10:15AM - 04:15PM"
      },
    }, {

      S_Email_id: "rajs@gmail.com",
      S_Store: "nokia",
      status: "",
      Store_Name: "sri shakthi mobile service",
      S_Services: "Settings Faults,Regular Service,Hardware Faults",
      Store_long_description: "Undertake all kind of nokia mobiles",
      Store_short_description: "Undertake all kind of nokia mobiles",
      Day: {
        "monday": "09:00AM - 06:00PM",
        "tuesday": "09:00AM - 06:00PM",
        "wednesday": "09:00AM - 06:00PM",
        "thursday": "09:00AM - 06:00PM",
        "friday": "09:00AM - 06:00PM",
        "saturday": "09:00AM - 06:00PM",
        "sunday": "Leave"
      },

    }, {

      S_Email_id: "sprtive23@gmail.com",
      S_Store: "nokia,samsung",
      status: "",
      Store_Name: "sun mobile service center",
      S_Services: "Regular Service,overall maintenance,Mobile Shield Installation",
      Store_long_description: "Undertake all kind of nokia,samsung mobiles",
      Store_short_description: "Undertake all kind of nokia,samsung mobiles",
      Day: {
        "monday": "08:30AM - 07:30PM",
        "tuesday": "02:30PM - 07:30PM",
        "wednesday": "08:30AM - 07:30PM",
        "thursday": "08:30AM - 07:30PM",
        "friday": "08:30AM - 07:30PM",
        "saturday": "08:15AM - 02:15PM",
        "sunday": "8:15AM - 12:15AM"
      },

    }, {

      S_Email_id: "super@gmail.com",
      S_Store: "nokia,samsung",
      status: "",
      Store_Name: "ragu mobile service center",
      S_Services: "Regular Service,overall maintenance,Mobile Shield Installation",
      Store_long_description: "Undertake all kind of nokia,samsung mobiles",
      Store_short_description: "Undertake all kind of nokia,samsung mobiles",
      Day: {
        "monday": "10:00AM - 10:00PM",
        "tuesday": "10:00AM - 10:00PM",
        "wednesday": "10:00AM - 10:00PM",
        "thursday": "10:00AM - 10:00PM",
        "friday": "10:00AM - 10:00PM",
        "saturday": "leave",
        "sunday": "leave"
      },


    }]
    var date = new Date();

    $scope.hhmmsstt = $filter('date')(new Date(), 'hh:mm:ss a');
    //console.log($scope.hhmmsstt);
  })
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
  <div ng-controller="myCntrl">
    <label>Search on Label</label>
    <br>
    <input ng-model="query" type="text" placeholder="Search for name" />
    <br>
    <br>

    <div ng-repeat="dealer in dealers">

      {{dealer.Store_Name}}
      <br>{{dealer.S_Email_id}}
      <br>{{dealer.Day}}
      <br>
      <input type="button" value="order" ng-disabled="!isOpen(dealer.Day)" />
      <span>{{isOpen(dealer.Day) ? 'Open' : 'Closed'}}</span>
      <br>
      <br>
      <br>

    </div>

  </div>
</div>

#1


0  

You want to use ng-disabled on your input button, with an expression comparing Today with the day of week inside dealer.Day, Then you have to split the day value by " - " to get the begin and end time, and check if now is between those two times. It needs date conversion and parsing.

你想在你的输入按钮上使用ng-disabled,用一个表达式比较今天和经销商里面的星期几。然后,你必须将日期值除以“ - ”以得到开始和结束时间,并检查是否现在介于这两次之间。它需要日期转换和解析。

angular.module('myApp', [])
  .controller("myCntrl", function($scope, $filter) {

    $scope.isOpen = function(dealerSchedule) {
      var now = new Date();
      // 09:10AM - 06:30PM
      var times = dealerSchedule[Object.keys(dealerSchedule)[now.getDay() - 1]].replace(/(\d\d\:\d\d)(AM|PM)/g, '1/1/1900 $1 $2').split(" - ");
      var nowTime = new Date('1/1/1900 ' + now.toLocaleTimeString(navigator.language, {
        hour: '2-digit',
        minute: '2-digit',
        hour12: true
      }));
      return nowTime >= new Date(times[0]) && nowTime <= new Date(times[1]);
    };

    $scope.dealers = [{

      S_Email_id: "aditiya@gmail.com",
      S_Store: "samsung",
      status: "",
      Store_Name: "Adtiya Samsung Store",
      S_Services: "Regular Service,Software Faults,Hardware Faults",
      Store_long_description: "Undertake all kind of samsung mobiles",
      Store_short_description: "Undertake all kind of samsung mobiles",
      Day: {
        "monday": "09:10AM - 06:30PM",
        "tuesday": "09:10AM - 12:00PM",
        "wednesday": "09:10AM - 10:30AM",
        "thursday": "09:10AM - 06:30PM",
        "friday": "09:10AM - 06:30PM",
        "saturday": "10:15AM - 04:15PM",
        "sunday": "10:15AM - 04:15PM"
      },
    }, {

      S_Email_id: "rajs@gmail.com",
      S_Store: "nokia",
      status: "",
      Store_Name: "sri shakthi mobile service",
      S_Services: "Settings Faults,Regular Service,Hardware Faults",
      Store_long_description: "Undertake all kind of nokia mobiles",
      Store_short_description: "Undertake all kind of nokia mobiles",
      Day: {
        "monday": "09:00AM - 06:00PM",
        "tuesday": "09:00AM - 06:00PM",
        "wednesday": "09:00AM - 06:00PM",
        "thursday": "09:00AM - 06:00PM",
        "friday": "09:00AM - 06:00PM",
        "saturday": "09:00AM - 06:00PM",
        "sunday": "Leave"
      },

    }, {

      S_Email_id: "sprtive23@gmail.com",
      S_Store: "nokia,samsung",
      status: "",
      Store_Name: "sun mobile service center",
      S_Services: "Regular Service,overall maintenance,Mobile Shield Installation",
      Store_long_description: "Undertake all kind of nokia,samsung mobiles",
      Store_short_description: "Undertake all kind of nokia,samsung mobiles",
      Day: {
        "monday": "08:30AM - 07:30PM",
        "tuesday": "02:30PM - 07:30PM",
        "wednesday": "08:30AM - 07:30PM",
        "thursday": "08:30AM - 07:30PM",
        "friday": "08:30AM - 07:30PM",
        "saturday": "08:15AM - 02:15PM",
        "sunday": "8:15AM - 12:15AM"
      },

    }, {

      S_Email_id: "super@gmail.com",
      S_Store: "nokia,samsung",
      status: "",
      Store_Name: "ragu mobile service center",
      S_Services: "Regular Service,overall maintenance,Mobile Shield Installation",
      Store_long_description: "Undertake all kind of nokia,samsung mobiles",
      Store_short_description: "Undertake all kind of nokia,samsung mobiles",
      Day: {
        "monday": "10:00AM - 10:00PM",
        "tuesday": "10:00AM - 10:00PM",
        "wednesday": "10:00AM - 10:00PM",
        "thursday": "10:00AM - 10:00PM",
        "friday": "10:00AM - 10:00PM",
        "saturday": "leave",
        "sunday": "leave"
      },


    }]
    var date = new Date();

    $scope.hhmmsstt = $filter('date')(new Date(), 'hh:mm:ss a');
    //console.log($scope.hhmmsstt);
  })
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
  <div ng-controller="myCntrl">
    <label>Search on Label</label>
    <br>
    <input ng-model="query" type="text" placeholder="Search for name" />
    <br>
    <br>

    <div ng-repeat="dealer in dealers">

      {{dealer.Store_Name}}
      <br>{{dealer.S_Email_id}}
      <br>{{dealer.Day}}
      <br>
      <input type="button" value="order" ng-disabled="!isOpen(dealer.Day)" />
      <span>{{isOpen(dealer.Day) ? 'Open' : 'Closed'}}</span>
      <br>
      <br>
      <br>

    </div>

  </div>
</div>