Skip to content

Instantly share code, notes, and snippets.

@Hengjie
Created September 26, 2013 11:55
Show Gist options
  • Save Hengjie/6713117 to your computer and use it in GitHub Desktop.
Save Hengjie/6713117 to your computer and use it in GitHub Desktop.
How to use Mailcheck.js with AngularJS https://github.com/Kicksend/mailcheck/
%input{:name => "email", :type => "email", :"ng-model" => "email"}(mailcheck)/
%small.ng-cloak.mailcheck{:"ng-show" => "mailcheck.suggested"}
Did you mean
%a{:"ng-click" => "mailcheck.select()", :href => "#"}
%span.address> {{mailcheck.suggestion.address}}
@
%span.domain> {{mailcheck.suggestion.domain}}
?
# Mailcheck directive
ng.directive 'mailcheck', ->
return {
restrict: 'A'
controller: ['$scope', ($scope)->
# mailCheck
@suggestion = null
@empty = ->
console.log 'empty()'
@suggested = false
@suggestion = null
@suggest = (suggestion)->
console.log 'suggest()', suggestion
@suggested = true
@suggestion = suggestion
@select = ->
console.log 'select()', @suggestion.full
$scope.email = @suggestion.full
@empty()
]
compile: (element, attributes, _)->
return {
pre: (scope, element, attributes, mailcheckController)->
scope.mailcheck = mailcheckController
post: (scope, element, attributes, mailcheckController)->
element.on 'keyup blur', ->
element.mailcheck({
suggested: (ele, suggestion)-> mailcheckController.suggest(suggestion)
empty: (ele)-> scope.$apply -> mailcheckController.empty()
})
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment