>>Hi everybody,
>>
>>I have the following directive:
>>

>>app.directive('smDateTimePicker', [function () {
>>        return {
>>            require: 'ngModel',
>>            restrict: 'E',
>>
>>            scope: {
>>                ngModel: '=',//the date being saved to the database
>>                compareDate: '=',//either the start or end date of the range for validation (isDateRange attr must be set to true)
>>                form: '=',//the name of the form (if a subform, this will be parent.subform), used for setting the form to dirty and validation
>>                name: '@',//the input's name, used to manually outline invalid fields in red
>>                placeholder: '@',//text of placeholder on input field, 
>>                showBod: '=',//if true, we display the Beginning of Day button (pickTime must be true)
>>                showEod: '=',//if true, we display the End of Day button (pickTime must be true)
>>                showNow: '=',//if true, we display the Now button
>>                setBod: '&',//function defined in the directive that is called when clicking on the BOD button
>>                setEod: '&',//function defined in the directive that is called when clicking on the EOD button
>>                setNow: '&',//function defined in the directive that is called when clicking on the Now button
>>                validStartDateRange: '&',//function defined in the directive that determines whether to show validation message
>>                validEndDateRange: '&',
>>                validRequired: '&',
>>                validFutureDate: '&',
>>                validPastDate: '&'
>>            }

>>
>>and the template is
>>
>>

>><div class="input-group">
>>    <input type="text" autocomplete="off" id="{{name}}" name="{{name}}" class="form-control" placeholder="{{placeholder}}" />
>>    <span class="input-group-addon datepickerbutton">
>>        <i class="fa fa-clock-o"></i>
>>    </span>
>></div>
>><div class="field-validation-error">
>>    <span ng-show="!validTimeRange()">@Messages.invalidStartTime</span>    
>></div>

>>
>>So, in my form I have it
>>
>>

>><data-sm:-time-picker ng-model="result.bHoldExpires"
>>                                                          form="form.editMax4saleGeneralForm.subCategoriesRow"
>>                                                          class="col-md-9"
>>                                                          ng-readonly="!result.isbHold" 
>>                                                          name="bHoldExpires"
>>                                                          placeholder="00:00"
>>                                                          is-time-range="false">
>>                                    </data-sm:-time-picker>

>>
>>and ng-readonly has no effect and also I can type anything (all letters) in the textbox. I am wondering if we should have a simple way of exposing the readonly property.
>>
>>Thanks in advance.
>
>'smDateTimePicker' and data-sm:-time-picker ?

Yes, it's the same directive as AngularJs has some rules and when we use Camel case for myDirective it becomes my-directive when it's used. When you add data prefix (to avoid JavaScript warnings in VS), it becomes data-my:directive.

But you didn't answer my question. I suppose the only way is to introduce readonly flag in the directive properties.